@import url('https://fonts.googleapis.com/css?family=Open+Sans+Condensed:700');

@font-face {
   font-family: 'password';
   font-style: normal;
   font-weight: 400;
   src: url("https://web.zuglo.hu/css/fonts/password.ttf");
}

input.passkey {
   font-family: 'password';
}

body {
   font-family: "Arial", "sans-serif", "Trebuchet MS", "Helvetica", "Verdana";
   font-size: 0.9em;
   margin: 0;
   background: #F2F2F2;
   width: 100%;

}




/*
 *    Module Menu
 */


#module-menu {
   position: fixed;
   min-width: 1020px;
   display: block;
   width: 100%;
   margin: 0 auto;
   padding: 9px 0;
   background: #aabbaa;
   border-top: 1px solid #ccddcc;
   border-bottom: 1px solid #889988;
   z-index: 9000;
}

#module-menu ul {
   display: block;
   min-width: 1000px;
   max-width: 1200px;
   margin: 0 auto;
   padding: 0;
}

#module-menu ul li {
   float: left;
   margin: 0 5px;
   list-style-type: none;
   display: block;
}

#module-menu a {
   text-decoration: none;
   font-size: 17px;
   font-weight: bold;
   color: #000;
   background: #bbccbb;
   padding: 4px 10px;
   border: 1px solid #889988;
   margin: 0;

   border-radius: 3px;
   -moz-border-radius: 3px;

   -webkit-box-shadow: 0px 0px 7px #999;
   -moz-box-shadow: 0px 0px 7px #999;
   box-shadow: 0px 0px 7px #999;

   transition: 0.2s ease;

}

#module-menu a:hover {
   background-color: #ddeedd !important;
   color: #000;
   -webkit-box-shadow: 0px 0px 7px #aaa;
   -moz-box-shadow: 0px 0px 7px #aaa;
   box-shadow: 0px 0px 7px #aaa;

}

.shadow {

   -webkit-box-shadow: 0px 0px 7px #aaa;
   -moz-box-shadow: 0px 0px 7px #aaa;
   box-shadow: 0px 0px 7px #aaa;
}


.DMS-ticket>td {

   color: blue;
}

.IT-ticket {

   color: #1c6a20;

}


/*
 *    Sub Menu
 */

.red {
   color: red;
   font-weight: bold;
}

.yellow {
   color: #ffaa0a;
   font-weight: bold;

}

.level1 {
   position: fixed;
   z-index: 9000;
   top: 40px;
}

.level2 {
   position: fixed;
   z-index: 9000;
   top: 80px;
}

#sub-menu {
   display: block;
   width: 100%;
   height: auto;
   min-width: 1020px;
   margin: 0 auto;
   padding: auto;
   background: #aaa;
   border-top: 1px solid #bbb;
   border-bottom: 2px solid #999;
}

#sub-menu ul {
   display: block;
   height: auto;
   min-width: 1000px;
   max-width: 1200px;
   margin: 0 auto;
   padding: 0px;
}

#sub-menu ul li {
   float: left;
   height: auto;
   margin: 3px 5px;
   list-style-type: none;
   display: block;
}

#sub-menu a {
   text-decoration: none;
   height: auto;
   font-size: 17px;
   font-weight: bold;
   color: #000;
   background: #ccc;
   padding: 5px 10px;
   border: 1px solid #999;
   margin: 0;
   float: left;

   border-radius: 3px;
   -moz-border-radius: 3px;
   /* -webkit-box-shadow: 0px 0px 7px #777;
   -moz-box-shadow: 0px 0px 7px #777;
   box-shadow: 0px 0px 7px #777; */
   transition: 0.2s ease;

}

#module-menu a.active,
#sub-menu a:hover {
   background-color: #ddeedd !important;
   color: #000 !important;
}

#sub-menu a.active,
#sub-menu a:hover {
   background-color: #016718 !important;
   text-shadow: 0 0.1em 0.1em #016718;
   color: white !important;
   -webkit-box-shadow: 0px 0px 7px #aaa;
   -moz-box-shadow: 0px 0px 7px #aaa;
   box-shadow: 0px 0px 7px #aaa;
}

a.inactiv {
   color: #888 !important;

}

/*
 *    Page Menu
 */

#page_menu {
   display: block;
   /*	border: 1px solid grey;
	background: #f0f0f0;
*/
   height: 60px;
}

#page_menu ul {
   padding: 0;
}

#page_menu li {
   float: left;
   list-style-type: none;
   margin: 0 10px;
   border: 1px solid gray;
   padding: 5px 0;
   -webkit-box-shadow: 0px 0px 7px #999;
   -moz-box-shadow: 0px 0px 7px #999;
   box-shadow: 0px 0px 7px #999;

}

#page_menu a {
   text-decoration: none;
   font-weight: bold;
   background: #5bd84e;
   padding: 5px 10px;
   color: green;
}


/*
 *    Page related elemnts
 */


.right {
   float: right;
}

select,
textarea {
   padding: 5px;
   font-size: 1.1em;
   border: 1px solid #547912 !important;
   margin: 2px;
}

input[type="text"],
input[type="number"],
input[type="password"] {
   padding: 5px;
   font-size: 1.1em;
   /* border: 1px solid #547912; */
   margin: 5px auto;

}


input[type="text"]:valid {
   color: #000;
}

input[type="text"]:invalid {
   color: red;
}


select:focus,
input[type="text"]:focus,
input[type="password"]:focus {

   border: 1px solid #333;
   /* background: #E3FFCF; */
   /* -webkit-box-shadow: 0px 0px 7px #aaa;
   -moz-box-shadow: 0px 0px 7px #aaa;
   box-shadow: 0px 0px 7px #aaa; */
}



/*
.button,
button,
input[type="reset"], 
input[type="submit"] {

   padding: 7px 20px;
   font-weight: bold;
   font-size: 1.2em;
   
 	-webkit-box-shadow: 0px 0px 7px #a0a0a0;
	-moz-box-shadow: 0px 0px 7px #a0a0a0;
	box-shadow: 0px 0px 7px #a0a0a0;

   background: #bbccbb;
   border: 1px solid #889988;
   color: #333;
   text-decoration: none;

}

.button:hover,
button:hover,
input[type="reset"]:hover, 
input[type="submit"]:hover {
   color: #fff;
   background-color: #016718;
   border: 1px solid #444;

 	-webkit-box-shadow: 0px 0px 7px #444;
	-moz-box-shadow: 0px 0px 7px #444;
	box-shadow: 0px 0px 7px #444;

}

*/

/*
 *    Content
 */

#content {
   display: block;
   min-width: 1000px;
   min-height: 100vh;
   max-width: 1200px;
   margin: 0 auto;
   padding: 120px 10px 20px 10px;
   background: #fff;
   border-left: 2px solid #c3c3c3;
   border-right: 2px solid #c3c3c3;
   color: black;

}

#footer {
   position: fixed;
   bottom: 0;
   left: 0;
   width: 100%;
   padding-top: 20px;
   background-color: #333;
   border-top: 2px solid #999;
   overflow: auto;
}

/*
 *    Login Page
 */


.login {

   display: block;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   height: 260px;
   width: 260px;
   /* margin: 70px auto; */
   /* border: 1px solid #aaa; */
   border-radius: 5px;
   padding: 20px 10px 10px 60px;
   background-color: #e4e4e4;

   /* -webkit-box-shadow: 0px 0px 7px #aaa;
   -moz-box-shadow: 0px 0px 7px #aaa;
   box-shadow: 0px 0px 7px #aaa; */
   /* background: url("img/green_line.png") -30px 0 repeat-y; */
}

.login label {
   display: block;
   width: 100px;
   font-weight: bold;

}


/*
 *    Form style
 */

.form_label {
   display: block;
   font-size: 1.3em;
   font-weight: bold;
   width: 200px;
   float: left;
   margin-top: 6px;
   text-align: right;
   padding-right: 10px;

}

.form_label_textarea {
   display: block;
   font-size: 1.3em;
   font-weight: bold;
   text-align: right;
   width: 200px;

}

.form_field {
   display: block;

}

a {
   color: green;
}

.link {
   /*
	padding: 5px;
	margin-left: 8px;
*/
   text-decoration: none;
   font-weight: bold;
}

.link:hover {

   text-decoration: underline;
}

a {
   text-decoration: none;
   font-weight: bold;
}

a:hover {

   text-decoration: underline;
}

.noedit {

   font-style: italic;
   color: #777;
}

/*
 *    Table style
 */

.grid {
   border-collapse: collapse;
   border: 1px solid #ddd;

   -moz-box-shadow: 0px 0px 7px #525252;
   -webkit-box-shadow: 0px 0px 7px #525252;
   box-shadow: 0px 0px 7px #525252;

}

.grid th {
   padding: 10px 10px;
   border: 1px solid #ccc;
   background: #eee;
}

.grid td {
   padding: 10px 10px;
   border: 1px solid #ccc;
   background: #fafafa;
}

.form_content p {
   margin: 0;
}

/*
 * Tooltip
 */

.ui-tooltip,
.arrow:after {
   background: black;
   border: 1px solid greenyellow;
}

.ui-tooltip {
   padding: 10px 20px;
   color: white;
   border-radius: 10px;
   font: bold 14px "Helvetica Neue", Sans-Serif;
   /*    text-transform: uppercase; */
   box-shadow: 0 0 10px black;
}

#order_table table {
   border-collapse: collapse;
   border: 1px solid #333;
   -moz-box-shadow: 0px 0px 7px #333;
   -webkit-box-shadow: 0px 0px 7px #333;
   box-shadow: 0px 0px 7px #333;
   margin: 15px auto;
   width: 100%;
}

#order_table th {
   font-size: 1em;
   padding: 9px 5px;
   border: 1px solid #fff;

}

#order_table td {
   font-size: 0.9em;
   padding: 10px;
   border: 1px solid #999;
}


#page_table table {
   border-collapse: collapse;
   border: 2px solid #effeea;
   -moz-box-shadow: 0px 0px 7px #333;
   -webkit-box-shadow: 0px 0px 7px #333;
   box-shadow: 0px 0px 7px #333;
   margin: 15px auto;
   width: 100%;
}

#page_table th {
   font-size: 1em;
   padding: 9px 5px;
   border: 2px solid white;
   background: #d0d0d0;
}

#page_table td {
   font-size: 0.9em;
   padding: 5px;
   border: 2px solid white;
}

#page_table tr:nth-child(even) {
   background: #f2fdef;
   transition: background-color 2s linear 1s;
   transition: 3s ease-in-out;
   transition: 2s;
}

#page_table tr:nth-child(odd) {
   background: #e9ffe3;
   transition: background-color 1s linear 1s;
   transition: 3s ease-in-out;
   transition: 1s;
}

#page_table tr:hover {
   background-color: yellowgreen;
}

/* SMALLL  */

#page_table_small table {
   border-collapse: collapse;
   border: 1px solid #effeea;
   -moz-box-shadow: 0px 0px 7px #333;
   -webkit-box-shadow: 0px 0px 7px #333;
   box-shadow: 0px 0px 7px #333;
   margin: 5px auto;
   width: 100%;
}

#page_table_small th {
   font-size: 0.9em;
   padding: 3px;
   border: 1px solid white;
   background: #d0d0d0;
}

#page_table_small td {
   font-size: 0.9em;
   padding: 2px;
   border: 1px solid white;
}

#page_table_small tr:nth-child(even) {
   background: #f2fdef;
   transition: background-color 2s linear 1s;
   transition: 3s ease-in-out;
   transition: 2s;
}

#page_table_small tr:nth-child(odd) {
   background: #e9ffe3;
   transition: background-color 1s linear 1s;
   transition: 3s ease-in-out;
   transition: 1s;
}

#page_table_small tr:hover {
   background-color: yellowgreen;
}


.href_modify {
   text-decoration: none;
   float: right;
   margin: 0 5px;
   font-weight: bold;
   border: 1px solid green;
   padding: 1px 5px;
   margin: 0 5px;
   border-radius: 6px;
}

.href_delete {
   text-decoration: none;
   float: right;
   border: 1px solid green;
   padding: 1px 5px;
   margin: 0 5px;
   font-weight: bold;
   border-radius: 6px;

}

.href_delete:hover,
.href_modify:hover {
   background: green;
   color: white;

}

/*
 * Data Filter
 */

.data_filter {
   border: 1px solid #333;
   display: block;
   width: 99%;
   margin: 0 auto;
   min-height: 150px;
   border: 2px solid white;
   background: #eee;
   -moz-box-shadow: 0px 0px 7px #333;
   -webkit-box-shadow: 0px 0px 7px #333;
   box-shadow: 0px 0px 7px #333;
   padding: 5px 0;
   margin-top: -10px;
}

.filter_content {
   display: block;
   float: left;
   /*	border: 1px solid #000; */
   width: 84%;
   /*	height: 99px; */
}

.filter_buttons {
   display: block;
   float: right;
   /*	border: 1px solid #000; */
   width: 15%;
   /*	height: 99px; */
}

.filter_buttons p {
   margin: 10px auto;
   text-align: center;
}

.filter_buttons input[type="submit"] {
   width: 130px;
   background-color: pink;

}

.filter_buttons .button {
   width: 88px;
   display: block;
   margin: 0 auto;

}

.filter_content label {
   font-weight: bold;
   font-size: 1.2em;
   margin: 0 10px;
}

.filter_content span {
   display: block;
   float: left;
   margin: 0px;
}

.filter_arrow_right,
.filter_arrow_left {
   text-decoration: none;
   margin: 0 10px;
}


/** V1 */
.form-content {
   padding: 15px;
   display: block;
}

.form-element {
   clear: left;
   padding: 2px 0;
}

.form-entry-content {
   margin-left: 140px;

}

.form-entry-title {
   float: left;
   text-align: right;
   width: 115px;
   padding: 5px 5px 0 0;
   white-space: normal;
}

.form-file-list-name {
   float: left;
   display: block;
}

.form-file-list {
   display: block;
   border-bottom: 1px solid #ccc;
   height: 20px;
   padding: 0 10px;
   background: #eee;
}

.clear-both {
   clear: both;
   display: block;
}

.form-file-list-checkbox {
   float: right;
   display: block;
}

.form-file-list {
   display: block;
}

#list-content,
#filter-content {
   display: block;
   margin: 5px;
   min-height: 100px;
   box-sizing: border-box;
   padding: 0 5px;
}

.list-table th {
   font-size: 0.9em;
   padding: 10px 3px;
   border: 2px solid white;
   background: #d0d0d0;
}

.list-table {
   border-collapse: collapse;
   border: 2px solid #effeea;
   -moz-box-shadow: 0px 0px 7px #333;
   -webkit-box-shadow: 0px 0px 7px #333;
   box-shadow: 0px 0px 7px #333;
   margin: 10px auto;
   display: table;
   border-spacing: 2px;
   border-color: gray;
}

.list-table td {
   font-size: 0.8em;
   padding: 4px;
   border: 2px solid white;
   height: auto;
}

.list-table tr:nth-child(even) {
   background: #f2fdef;
   transition: background-color 2s linear 1s;
   transition: 3s ease-in-out;
   transition: 2s;
}

.list-table tr:nth-child(odd) {
   background: #e9ffe3;
   transition: background-color 1s linear 1s;
   transition: 3s ease-in-out;
   transition: 1s;
}



input,
select,
textarea {
   border: 1px solid #d4d4d4;
   padding: 5px 5px;
   -webkit-border-radius: 3px;
   -moz-border-radius: 3px;
   border-radius: 5px;
}

input[type="file"] {
   padding: 2px 7px;
   border: 1px solid #547912 !important;
}

.file-upload::-webkit-file-upload-button {
   display: inline-block;
   zoom: 1;
   vertical-align: baseline;
   margin: 0 2px;
   outline: none;
   cursor: pointer;
   text-align: center;
   text-decoration: none;
   font-size: 12px;
   padding: .4em 1.5em .42em;
   text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
   -webkit-border-radius: .5em;
   -moz-border-radius: .5em;
   border-radius: .5em;
   -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
   -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
   box-shadow: 0 1px 2px rgba(0, 0, 0, .2);

   color: #e8f0de;
   border: solid 1px #538312;
   background: #64991e;
   background: -webkit-gradient(linear, left top, left bottom, from(#7db72f), to(#4e7d0e));
   background: -moz-linear-gradient(top, #7db72f, #4e7d0e);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7db72f', endColorstr='#4e7d0e');
}

.form-title {

   font-size: 1.3em;
   border-bottom: 5px solid #ddeedd;
   font-weight: bold;

   padding: 5px 15px;
   font-weight: bold;
   color: #333;
   text-shadow: 1px 1px 1px #889988;
}

.green {
   color: #e8f0de;
   border: solid 1px #538312;
   background: #1f9851;
   background: -webkit-gradient(linear, left top, left bottom, from(#7db72f), to(#4e7d0e));
   background: -moz-linear-gradient(top, #7db72f, #4e7d0e);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7db72f', endColorstr='#4e7d0e');
}

.green:hover {
   background: #22a558;
   background: -webkit-gradient(linear, left top, left bottom, from(#6b9d28), to(#436b0c));
   background: -moz-linear-gradient(top, #6b9d28, #436b0c);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6b9d28', endColorstr='#436b0c');
}

.blue {
   color: #d2e1fa;
   border: solid 1px #0c3475;
   background: #4287f5;
   background: -webkit-gradient(linear, left top, left bottom, from(#2760ba), to(#4287f5));
   background: -moz-linear-gradient(top, #2760ba, #4287f5);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7db72f', endColorstr='#4e7d0e');
}

.blue:hover {
   background: #4287f5;
   background: -webkit-gradient(linear, left top, left bottom, from(#2760ba), to(#4287f5));
   background: -moz-linear-gradient(top, #2760ba, #4287f5);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2760ba', endColorstr='#2760ba');
}


.button:hover {
   text-decoration: none;
}

.red {
   color: #faddde;
   border: solid 1px #980c10;
   background: #d81b21;
   background: -webkit-gradient(linear, left top, left bottom, from(#ed1c24), to(#aa1317));
   background: -moz-linear-gradient(top, #ed1c24, #aa1317);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ed1c24', endColorstr='#aa1317');
}

.red:hover {
   background: #b61318;
   background: -webkit-gradient(linear, left top, left bottom, from(#c9151b), to(#a11115));
   background: -moz-linear-gradient(top, #c9151b, #a11115);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c9151b', endColorstr='#a11115');
}

.button:hover {
   text-decoration: none;
}


.black {
   color: #d7d7d7;
   border: solid 1px #333;
   background: #333;
   background: -webkit-gradient(linear, left top, left bottom, from(#666), to(#000));
   background: -moz-linear-gradient(top, #666, #000);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#666666', endColorstr='#000000');
}

.button {
   display: inline-block;
   zoom: 1;
   vertical-align: baseline;
   margin: 0 2px;
   outline: none;
   cursor: pointer;
   text-align: center;
   text-decoration: none;
   font: 14px/100% Arial, Helvetica, sans-serif;
   padding: .5em 2em .55em;
   /* text-shadow: 0 1px 1px rgba(0, 0, 0, .3); */
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
   /* -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
   -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .2); */
   /* box-shadow: 0 1px 2px rgba(0, 0, 0, .2); */
}

.white {
   color: #606060;
   border: solid 1px #b7b7b7;
   background: #fff;
   background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
   background: -moz-linear-gradient(top, #fff, #ededed);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed');
}

.small {
   font-size: 11px;
   padding: .2em 1em .275em;
}

.medium {
   font-size: 12px;
   padding: .4em 1.5em .42em;
}

.bigrounded {
   -webkit-border-radius: 2em;
   -moz-border-radius: 2em;
   border-radius: 2em;
}

.form-background {
   background: -moz-linear-gradient(top, rgba(219, 219, 219, 0.65) 0%, rgba(0, 0, 0, 0) 69%);
   /* FF3.6+ */
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(219, 219, 219, 0.65)), color-stop(69%, rgba(0, 0, 0, 0)));
   /* Chrome,Safari4+ */
   background: -webkit-linear-gradient(top, rgba(219, 219, 219, 0.65) 0%, rgba(0, 0, 0, 0) 69%);
   /* Chrome10+,Safari5.1+ */
   background: -o-linear-gradient(top, rgba(219, 219, 219, 0.65) 0%, rgba(0, 0, 0, 0) 69%);
   /* Opera 11.10+ */
   background: -ms-linear-gradient(top, rgba(219, 219, 219, 0.65) 0%, rgba(0, 0, 0, 0) 69%);
   /* IE10+ */
   background: linear-gradient(to bottom, rgba(219, 219, 219, 0.65) 0%, rgba(0, 0, 0, 0) 69%);
   /* W3C */
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a6dbdbdb', endColorstr='#00000000', GradientType=0);
   /* IE6-9 */
}


.task-content {
   background: #f2fdef;
   box-sizing: border-box;
   padding: 5px 10px;
   ;
   border: 2px solid #effeea;
   -moz-box-shadow: 0px 0px 5px #333;
   -webkit-box-shadow: 0px 0px 5px #333;
   box-shadow: 0px 0px 5px #333;
}

.orders-fields {
   padding: 3px;
   background: #f2fdef;
   height: 25px;
   margin: 8px 0;
   overflow: hidden;
   //   border: 1px solid #AFFFAF;
   border: 2px solid #effeea;
   -moz-box-shadow: 0px 0px 5px #333;
   -webkit-box-shadow: 0px 0px 5px #333;
   box-shadow: 0px 0px 5px #333;
}

.orders-fields label {
   padding: 5px 25px;
   width: 100px;
   display: block;
   float: left;
   background: #fff;
   color: #000;
   text-align: right;
}

.orders-fields span {
   display: block;
   padding: 5px 15px;
   float: left;
}

.accordion {
   font-size: 1em;
}

.mytree {

   padding: 3px 5px 1px 5px;
   margin-bottom: 4px;
   background: #CCFFBF;
   border: 1px solid #9DFF85;
}


/**
 * Framework starts from here ...
 * ------------------------------
 */


.tree li {
   margin: 0px 0;
   list-style-type: none;
   position: relative;
   padding: 20px 5px 0px 5px;
}

.tree li::before {
   content: '';
   position: absolute;
   top: 0;
   width: 1px;
   height: 100%;
   right: auto;
   left: -20px;
   border-left: 1px solid #aaa;
   bottom: 50px;
}

.tree li::after {
   content: '';
   position: absolute;
   top: 30px;
   width: 25px;
   height: 20px;
   right: auto;
   left: -20px;
   border-top: 1px solid #aaa;
}

.tree li a {
   display: inline-block;
   border: 1px solid #aaa;
   padding: 5px 10px;
   text-decoration: none;
   color: #000;
   font-family: arial, verdana, tahoma;
   font-size: 12px;
   border-radius: 5px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
}

/*Remove connectors before root*/
.tree>ul>li::before,
.tree>ul>li::after {
   border: 0;
}

/*Remove connectors after last child*/
.tree li:last-child::before {
   height: 30px;
}

/*Time for some hover effects*/
/*We will apply the hover effect the the lineage of the element also*/
.tree li a:hover,
.tree li a:hover+ul li a {
   background: green;
   color: #fff;
   border: 1px solid #94a0b4;
}

/*Connector styles on hover*/
.tree li a:hover+ul li::after,
.tree li a:hover+ul li::before,
.tree li a:hover+ul::before,
.tree li a:hover+ul ul::before {
   border-color: green;
}

.color_0 {
   background: #A3FFBC;
}

.color_1 {
   background: #A3FFBC;
}

.color_2 {
   background: #C7E5FF;
}

.color_3 {
   background: #D6ECFF;
}

.color_4 {
   background: #E0F1FF;
}

.color_5 {
   background: #E0F1FF;
}

.perm-content {
   font-size: 10px;
   display: block;
   width: 250px;
   float: right;
   background: #fff;
   padding: 1px 10px;
}

.perm-content label {
   float: left;
}

.perm-content a {
   float: right;
   background: url("img/SimpleDelete.gif") 0 0 no-repeat;
   display: block;
   width: 12px;
   height: 12px;
   margin-top 3px;
   text-decoration: none;
   border: 1px dotted #fff;
}

.perm-content a:hover {
   border: 1px dotted red;
}

.news_box {
   background: #f2fdef;
   box-sizing: border-box;
   padding: 10px;
   ;
   border: 2px solid #effeea;
   -moz-box-shadow: 0px 0px 5px #333;
   -webkit-box-shadow: 0px 0px 5px #333;
   box-shadow: 0px 0px 5px #333;
   margin: 10px 0;
}

.news_label {
   font-weight: bold;
   margin: 0;
   padding: 0 5px;
   border-bottom: 5px solid #ddeedd;
}

.news_content a {
   text-decoration: none;
   font-weight: bold;
}

.news_data {
   margin: 5px;
   text-align: right;
   font-size: 0.7em;
   font-weight: bold;
   font-style: italic;
   color: #777;
}

.news_content {
   margin: 5px 10px;
}

.title {
   color: #333;
   text-shadow: 1px 1px 1px #889988;
   font-size: 1.2em;
   border-bottom: 5px solid #ddeedd;
   font-weight: bold;
}

.content_box {
   background: #f2fdef;
   box-sizing: border-box;
   padding: 10px;
   ;
   border: 2px solid #effeea;
   -moz-box-shadow: 0px 0px 5px #8b8b8b;
   -webkit-box-shadow: 0px 0px 5px #8b8b8b;
   box-shadow: 0px 0px 5px #8b8b8b;
   margin: 10px 0;
}

.content_label {
   font-weight: bold;
   margin: 0;
   padding: 0 5px;
   font-size: 1.5em;
   border-bottom: 6px solid #ddeedd;
   color: #333;
   text-shadow: 1px 1px 1px #889988;
   border-bottom: 5px solid #ddeedd;
   font-weight: bold;
}

.content_content a {
   text-decoration: none;
   font-weight: bold;
}

.content_data {
   margin: 5px;
   text-align: right;
   font-size: 0.7em;
   font-weight: bold;
   font-style: italic;
   color: #777;
}

.content_content {
   margin: 5px 10px;
}

/* calendar */
table.calendar caption {
   display: table-caption;
   text-align: left;
   font-weight: bold;
   padding: 5px;
   font-size: 1.5em;
}

table.calendar {
   border-left: 1px solid #999;
   margin: 0 auto;
}

tr.calendar-row {}

.calendar td {
   font-size: 10px;
   position: relative;
   font-weight: bold;
}

td.calendar-free:hover {
   background: #eceff5;
}

td.calendar-day-np {
   background: #eee;
   min-height: 80px;
}

div.calendar-day-np {}

td.calendar-day-head {
   background: #ccc;
   font-weight: bold;
   text-align: center;
   width: 30px;
   height: 20px;
   padding: 2px;
   border-bottom: 1px solid #999;
   border-top: 1px solid #999;
   border-right: 1px solid #999;
}

div.day-number {
   color: #000;
   font-weight: bold;
   float: right;
   margin: -5px -5px 0 0;
   text-align: right;
}

div.day-number-red {
   color: red;
   font-weight: bold;
   float: right;
   margin: -5px -5px 0 0;
   text-align: right;

}

/* calendar */

.calendar-left-content {

   display: block;
   width: 450px;
   float: left;
}

.calendar-right-content {

   display: block;
   width: 300px;
   float: right;
}


.calendar-content,
.calendar-popup {

   display: none;
}

table.calendar caption {
   display: table-caption;
   text-align: left;
   font-weight: bold;
   padding: 5px;
   font-size: 1.5em;
}

table.calendar {
   border-left: 1px solid #999;
   margin: 0 auto;
}

tr.calendar-row {}

.calendar-title {
   text-align: center;
   font-size: 1.5em;
   margin: 10px;
}

.calendar td {
   font-size: 10px;
   position: relative;
   font-weight: bold;
}

td.calendar-free:hover {
   background: #eceff5;
}

td.calendar-day-np {
   background: #eee;
   min-height: 80px;
}

div.calendar-day-np {}

td.calendar-day-head {
   background: #ccc;
   font-weight: bold;
   text-align: center;
   width: 30px;
   height: 20px;
   padding: 2px;
   border-bottom: 1px solid #999;
   border-top: 1px solid #999;
   border-right: 1px solid #999;
}

div.day-number {
   color: #000;
   font-weight: bold;
   float: right;
   margin: -5px -5px 0 0;
   text-align: right;
}

div.day-number-red {
   color: red;
   font-weight: bold;
   float: right;
   margin: -5px -5px 0 0;
   text-align: right;

}

/* shared */
.calendar td,
td.calendar-day-np {
   width: 30px;
   padding: 5px;
   height: 15px;
   border-bottom: 1px solid #999;
   border-right: 1px solid #999;
}

.c_sel {
   background: #bbccbb;
   color: #000;
}

.rate_5 {
   display: block;
   width: 128px;
   height: 25px;
   background: url("img/rating.png") 0 2px no-repeat;
}

.rate_4 {
   display: block;
   width: 128px;
   height: 25px;
   background: url("img/rating.png") 0 -25px no-repeat;
}

.rate_3 {
   display: block;
   width: 128px;
   height: 25px;
   background: url("img/rating.png") 0 -52px no-repeat;
}

.rate_2 {
   display: block;
   width: 128px;
   height: 25px;
   background: url("img/rating.png") 0 -78px no-repeat;
}

.rate_1 {
   display: block;
   width: 128px;
   height: 25px;
   background: url("img/rating.png") 0 -106px no-repeat;
}


.extra-options {
   display: none;
}

.pincode {
   border: 1px solid #555;
   padding: 5px;
   color: gray;
   font-weight: bold;
   transition: background-color 2s, color 2s;
   background: gray;
   letter-spacing: 1px;
}

.pincode:hover {
   color: #000;
   background: white;
   cursor: none;
}

#pin_popup {
   position: fixed;
   display: none;
   background: #f0f0f0;
   border: 1px solid #ccc;
   width: 300px;
   height: 150px;
   -moz-box-shadow: 0 0 3px 3px #888;
   -webkit-box-shadow: 0 0 3px 3px#888;
   box-shadow: 0 0 3px 3px #888;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);

}

#call_details {
   position: fixed;
   display: none;
   background: #f0f0f0;
   border: 1px solid #ccc;
   min-width: 1000px;
   max-width: 1200px;
   height: 650px;
   -moz-box-shadow: 0 0 3px 3px #888;
   -webkit-box-shadow: 0 0 3px 3px#888;
   box-shadow: 0 0 3px 3px #888;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   z-index: 9999;
}

/**
   Notification Bell
*/


#notify_block {
   position: fixed;
   display: block;
   width: 1000px;
   height: 0px;
   margin: 0 auto;
   left: 35%;
   margin-left: -200px;
   z-index: 9990;
}

#notify_bell {
   width: 400px;
   position: relative;
   left: 620px;
   top: 0px;
   text-align: center;
   z-index: 9991;
}

.notify_nameday {
   position: absolute;
   top: 10px;
   left: 100px;
   color: #648264;
   font-weight: bold;
   font-family: 'Open Sans Condensed', sans-serif;
   font-size: 1.1em;
}

.notify_top {
   position: absolute;
   width: 100%;
   height: 38px;
   text-align: left;
}

.notify_bell {
   border: none;
   position: relative;
   top: 1px;
   left: 440px;
   width: 35px;
   height: 35px;
   background: url("img/qmcr_small.png") right top no-repeat;
}

.notify_bell a {
   width: 35px;
   height: 35px;
   display: block;
   z-index: 9999;
}

.notify_number {
   position: relative;
   left: 360px;
   top: -34px;
   border-radius: 50%;
   border: 3px solid #FFE066;
   width: 20px;
   height: 20px;
   padding-top: 3px;
   background: red;
   color: #fff;
   font-weight: bold;
   z-index: 9990;
   display: none;
}

.notify_bottom {
   position: relative;
   width: 100%;
   display: none;
}

.notify_tri_content {
   width: 100%;
   height: 20px;
}

.notify_tri {
   position: relative;
   left: 340px;
   width: 0px;
   height: 0px;
   border-style: solid;
   border-width: 0 10px 20px 10px;

   border-color: transparent transparent #fff transparent;

}

.notify_message {
   line-height: 35px;
   width: 100%;
   background: #fff;
   -webkit-box-shadow: 0px 2px 5px 2px rgba(100, 100, 100, 0.8);
   -moz-box-shadow: 0px 2px 5px 2px rgba(100, 100, 100, 0.8);
   box-shadow: 0px 2px 5px 2px rgba(100, 100, 100, 0.8);
}

.event {
   text-align: left;
   width: 100%;
   box-sizing: border-box;
   padding: 0px 10px;
   background: #CBEDC2;
   margin-top: 2px;
}

.event_main_title {
   font-weight: bold;
   font-size: 1.1em;
}

.event_title {
   font-weight: bold;
   font-size: 1em;
   display: block;
   line-height: 200%;
}

.event_content {
   display: block;
   line-height: 100%;
}

.event_footer {
   display: block;
   font-size: 0.8em;
   line-height: 200%;
   font-style: italic;
   color: #666;
}

.event_delete {
   width: 16px;
   height: 16px;
   display: block;
   background: url("img/delete.png") no-repeat;
   float: right;
   margin: 7px 10px 0 0;
}


.doc_div {
   padding: 0;
   margin: 4px 0;
}

.doc_left {
   float: left;
   display: block;
   margin: 0;
   font-weight: bold;
   font-size: 0.9em;
}

.doc_right {
   float: right;
   display: block;
   margin: 0;
   font-size: 0.9em;
}

.doc_content {
   margin: 0 0 2px 0;
   display: block;
}

.doc_div a {
   background: #f0fff1;
   border: 1px solid #beffc5;
   text-decoration: none;
   display: block;
   color: inherit;
   padding: 5px;
   font-weight: normal;
}

.doc_div a:hover {
   background: #46b246;
   color: #fff;
}

.doc_fail {
   background: #f0fff1;
   border: 1px solid #beffc5;
   text-decoration: none;
   display: block;
   color: inherit;
   padding: 5px;
   font-weight: normal;

}

.tooltip {
   position: relative;
   display: inline-block;
   border-bottom: 1px dotted black;
}

.tooltip .tooltiptext {
   visibility: hidden;
   min-width: 350px;
   background-color: white;
   color: #000;
   text-align: center;
   border-radius: 6px;
   padding: 10px;
   border: 2px solid #000;
   /* Position the tooltip */
   position: absolute;
   z-index: 1;
}

.tooltip:hover .tooltiptext {
   visibility: visible;
}

.ul_inventory {

   list-style-type: none;

}

/*******************************Calendar Top Navigation*********************************/
div#calendar {
   margin: 0px auto;
   padding: 0px;
   width: 902px;
   font-family: Helvetica, "Times New Roman", Times, serif;
}

div#calendar div.box {
   position: relative;
   top: 0px;
   left: 0px;
   width: 100%;
   height: 40px;
   background-color: #787878;
}

div#calendar div.header {
   line-height: 40px;
   vertical-align: middle;
   position: absolute;
   left: 11px;
   top: 0px;
   width: 96%;
   height: 40px;
   text-align: center;
}

div#calendar div.header a.prev,
div#calendar div.header a.next {
   position: absolute;
   top: 0px;
   height: 17px;
   display: block;
   cursor: pointer;
   text-decoration: none;
   color: #FFF;
}

div#calendar div.header span.title {
   color: #FFF;
   font-size: 18px;
}


div#calendar div.header a.prev {
   left: 0px;
}

div#calendar div.header a.next {
   right: 0px;
}




/*******************************Calendar Content Cells*********************************/
div#calendar div.box-content {
   border: 1px solid #787878;
   border-top: none;
}



div#calendar ul.label {
   float: left;
   margin: 0px;
   padding: 0px;
   margin-top: 5px;
   margin-left: 5px;
}

div#calendar ul.label li {
   margin: 0px;
   padding: 0px;
   margin-right: 5px;
   float: left;
   list-style-type: none;
   width: 120px;
   height: 40px;
   line-height: 40px;
   vertical-align: middle;
   text-align: center;
   color: #000;
   font-size: 15px;
   background-color: transparent;
}


div#calendar ul.dates {
   float: left;
   margin: 0px;
   padding: 0px;
   margin-left: 5px;
   margin-bottom: 5px;
}

/** overall width = width+padding-right**/
div#calendar ul.dates li {
   margin: 0px;
   padding: 0px;
   margin-right: 5px;
   margin-top: 5px;
   vertical-align: middle;
   float: left;
   list-style-type: none;
   width: 120px;
   height: 132px;
   background-color: #DDD;
   color: #000;
   text-align: center;
   font-size: 14px;
   font-weight: bold;
}

:focus {
   outline: none;
}

div.clear {
   clear: both;
}

.sit_box {
   margin: 3px auto;
   width: 112px;
   height: 30px;
   display: block;
   padding: 1px;
}

.sit_allow {
   border: 1px solid #5EB86A;
   background: #AAF2B3;
}

.sit_allow:hover {
   border: 1px solid #000;
   background: #01348C;
}

.sit_deny {
   border: 1px solid #D95F5F;
   background: #FC8D8D;
   color: #000;
}


.sit_ocupied {
   border: 1px solid #01348C;
   background: #85affc;
   color: yellow;
}

.sit_disabled {
   border: 1px solid #999;
   background: #ccc;
   color: #0000;
}

.sit_ocupied:hover {
   border: 1px solid #000;
   background: silver;
   color: white;
}

.cal_small {
   font-size: 9px;
   text-decoration: none;
   color: black;
   font-weight: normal;
}

.cal_small2 {
   font-size: 10px;
   color: black;
}

.entrace-table {

   margin: 0 auto;
   border-collapse: collapse;
}

.entrace-table td,
.entrace-table th {

   padding: 5px;
   border-bottom: 1px dashed #eee;
}

.entrace-table th {
   background: #eee;
}


.sms-modal,
.comment-modal {
   display: none;
   /* Hidden by default */
   position: fixed;
   /* Stay in place */
   z-index: 1;
   /* Sit on top */
   padding-top: 100px;
   /* Location of the box */
   left: 0;
   top: 0;
   width: 100%;
   /* Full width */
   height: 100%;
   /* Full height */
   overflow: auto;
   /* Enable scroll if needed */
   background-color: rgb(0, 0, 0);
   /* Fallback color */
   background-color: rgba(0, 0, 0, 0.4);
   /* Black w/ opacity */
}

.sms-box {

   display: block;
   width: 600px;
   height: 300px;
   border: 1px solid #999;
   background: #f0f0f0;
   z-index: 10;
   margin: 250px auto;
   padding: 10px;
}

.comment-div {
   display: block;
   width: 600px;
   height: 300px;
   border: 1px solid #999;
   background: #f0f0f0;
   z-index: 10;
   margin: 150px auto;
   padding: 10px;
}

.comment-content {
   padding: 0;
}

.comment-text {
   padding: 2px 0;
   margin: 0;
   display: block;
   text-align: left;
   font-size: 0.8em;
   font-weight: bold;
}



.info_dissmissal {

   padding: 1px 7px;
   background: yellow;
   border-radius: 9px;
   margin-right: 5px;
   cursor: help;
   border: 1px solid green;
   color: #000;
}

.phone_avatar {

   background: url("https://web.zuglo.hu/_images/avatar.png") 0 0 no-repeat;
   display: block;
   cursor: pointer;
   width: 16px;
   height: 16px;

}

.phone_picture {

   position: absolute;
   display: none;
   width: 150px;
   height: 200px;

}

.grow {
   transition: all .3s ease-in-out;
}

.grow:hover {
   transform: scale(1.6);
   font-size: 3em;
   cursor: text;
   color: blue;
   background: white;
   border: 1px solid black;
   text-align: center;
}

.extra-time-left {
   border-left: none !important;
}

.extra-time-right {
   border-right: none !important;
}

.customer_service {
   width: 1100px;
   min-height: 150px;
   border: 1px solid #999;

}

.cke_button__save_icon {
   display: none !important;
}

.cke_button__save_label {
   display: inline !important;
   font-weight: bold !important;
   text-transform: uppercase;
   color: darkred !important;
}

hr {
   opacity: 50%;
}