@font-face {
	font-family: OpenSans-Regular;
	src: url("/fonts/OpenSans-Regular-webfont.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
}
@font-face
{
	font-family: OpenSans-Bold;
	src: url("/fonts/OpenSans-Bold-webfont.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
}

@font-face
{
	font-family: OpenSans-Italic, serif;
	src: url("/fonts/OpenSans-Italic-webfont.woff2") format("woff2");
	font-weight: 400;
	font-style: italic;
}
:root
{
	--gh-primary-color: #03393a;
    --gh-secondary-color: rgb(0, 122, 80);
    --gh-third-color: rgba(0, 122, 80, 0.32);
	--gh-primary-text-color: #000;
    --gh-alert-color: #ff0000;
    --gh-success-color: #00ff00;
    --gh-warning-color: #ff00ff;
    --gh-info-color: #00ffff;
    --gh-danger-color: #ff0000;
    --gh-light-color: #f2f3f6;
    --gh-dark-color: #000;
    --gh-link-color: #000;
    --gh-link-hover-color: #000;
    --gh-link-visited-color: #000;
	--gh-link-text-color: #03393a;
	--gh-primary-bgcolor: rgba(0, 122, 80, 0.05);
	--gh-border-radius: 6px;
	--gh-font-size: 16px;
	--gh-font-regular: OpenSans-Regular;
	--gh-font-bold: OpenSans-Bold;
	--gh-font-italic: OpenSans-Italic;
	--gh-font-icons: Bootstrap-Icons;
	--gh-box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
}
html{font-family: var(--gh-font-regular);font-size: var(--gh-font-size);line-height: 1.6;}
body, html{height: 100%;display: flex;flex-direction: column;}
strong {font-family: var(--gh-font-bold);}
body{background-color: #F7FAFC;}
/*main menu  */
	header nav
    {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
        padding: 0 1rem;
        background-color: #fff;
    }
	header nav ul {list-style: none;}
	header nav .menu {display: flex; gap: 1rem;padding:0;align-items: center;justify-items: flex-start;}
    header nav .main-menu {margin-left: auto;}
    header nav #language_select {margin-left: auto;}
	header nav .menu ul
	{
		position: absolute;
		z-index: 10;
		padding: 0 ;
		background-color: #fff;
		box-shadow: var(--gh-box-shadow);
	}
    header nav .right_menu{margin-left: auto;}
	.menu ul a:hover{ color: #fff; background-color: #000; }
	nav .menu ul, nav .menu li:hover .menu ul, nav .menu ul li:hover .menu ul{display: none;}
	nav .menu li:hover ul, nav .menu ul li:hover ul, nav .menu ul ul li:hover ul {display: block;}
	.menu ul li a {display:flex;align-items: center;gap:0.5rem;padding:0.5em 1rem;white-space:nowrap;}

a{text-decoration: none;color: var(--gh-link-text-color);}
h1{font-size: 1.3rem; font-family: var(--gh-font-bold); margin-top:0;}
h2{font-size: 1.2rem; font-family: var(--gh-font-bold);}
h3, h4, h5, h6{font-size: 1.0rem; font-family: var(--gh-font-bold);}


/* forms */
form {margin: 0 auto;}
	fieldset{border-radius:var(--gh-border-radius); background-color: var(--gh-primary-bgcolor); padding: 0.5rem 1rem 1rem 1rem;}
	fieldset legend {padding: 0 0.5em; font-family: OpenSans-Bold, sans-serif;}
	form label {display: flex; flex-direction:column; gap:0.25em;margin: 0 0 0.25rem 0;}
	input:not([type='checkbox'], [type='radio']), textarea, select, button, a.button
	{
		border-radius: var(--gh-border-radius);
		border: 1px solid #aaa;
		padding: 0.25rem 0.5rem;
	}
	input:hover, input:focus, textarea:hover, textarea:focus { border: 1px solid #888; }

	input:hover, input:focus, textarea:hover, textarea:focus select:hover, select:focus{border: 1px solid #000;}
	button *, a.button, select, input *{color:#000;text-decoration: none;}
    button, a.button{padding: 0.25rem 0.5rem;display: inline-block; line-height: normal; }
	button:hover, a.button:hover{color:#000;border: 1px solid #000;}
    .naked-button{border:none;background:none;padding:0;margin:0;cursor:pointer;color:var(--gh-link-text-color);}
    .naked-button:hover{border:none;}
	.trumbowyg-button-pane button{min-width:0;}

    form .field-wrapper{margin: 0 0 1rem 0;
    }
    form .field-wrapper:last-of-type {margin: 0 0 0 0;
    }

   form .form-submits{margin: 1rem 0 0 0;
   }
    a.button {}
dialog
{
    border:0;
    border-radius: var(--gh-border-radius);
    box-shadow: var(--gh-box-shadow);
    padding:0;
}
    dialog .dlg_buttons { display: flex;gap: 1rem; margin:1em 0 0 0;}
    dialog::backdrop {background-color: rgba(0, 0, 0, 0.8);}
    dialog header {display: flex; gap:1rem; color:#fff;justify-content: space-between; align-items: center;padding: 0.25rem 0.5rem;background-color: rgb(0, 122, 80);
    }
    dialog footer
    {
        padding: 1em;
        border-top: 1px solid #ccc;
        text-align: right;
        background: #f9f9f9;
    }

    .dialog-footer button {padding: 5px 10px; font-size: 14px; cursor: pointer;}
    dialog fieldset {background-color: unset; border:0;}
    dialog .close-button {color: #fff;}


main{flex: 1; margin:1em; position:relative;}

.main-element-group
{
    background-color: #fff;
    border-radius: var(--gh-border-radius);
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
    padding: 1rem;
    margin: 0.5rem 0 1rem 0;
}
.main-element-group-centered
{
    margin-left: auto;
    margin-right: auto;
    width: 80%;
    max-width: 840px;
}


footer{text-align: right;background-color: #f2f3f6;border-top: 1px solid #ddd;}
	footer nav ul
	{
		list-style: none;
		display: flex;
		align-items: flex-end;
		gap: 1rem;
        padding:0 1em;
	}
footer nav ul {font-size: 0.7rem;}
footer nav ul #compile_time {margin-left: auto;}

.message-bar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width:100%;
	padding:0.25rem 0.5rem;
	z-index: 100000;
	font-weight: bold;
	color: #fff;
}
	.message-bar--success {background-color: green; animation: fade-out 6s forwards;}
	.message-bar--error {background-color: var(--gh-alert-color); }
	.message-bar--information {background-color: blue; animation: fade-out 6s forwards;}
	@keyframes fade-out {
		0% { opacity: 1; }
		80% { opacity: 1; }
		100% { opacity: 0; display: none; }
	}
	.close-button {background: none;border:none;padding:0;font-size:1rem;cursor:pointer;margin-left:auto;}
	.close-button:hover {border: none;}
	.close-button i {font-size: 28px;}

/* Contextmenu */

.context-menu
{
    position: absolute;
    z-index: 1000;
    list-style: none;
    margin: 0;
    padding: 0;
    background: #fff;
    border: 1px solid #ccc;
    box-shadow: var(--gh-box-shadow);
}

    .context-menu li {
        padding: 8px 20px;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 8px;
        white-space: nowrap;
    }
    .context-menu .divider
    {
        pointer-events: none; /* no hover */
        user-select: none; /* no selection */
        border-top: 1px solid gray;
        height: 0;
        margin: 0;
        padding: 0;
        width: 100%;
    }
    .context-menu li:hover { background-color: #f0f0f0; }


/* Overviews */

.form-filter
{
    list-style: none;
    gap: 0.5em;
    display:flex;
    padding:0;
    margin:0;
    justify-content:flex-start;
    flex-wrap: wrap;
    align-content:baseline;
}
.form-action
{
    list-style: none;
    gap: 1em;
    display:flex;
    padding:0;
    margin:2em 0 0 0;
    justify-content:left;
    flex-wrap: wrap;
    align-items:center;
    align-content:center;
}
.export_csv{margin-left: auto;
}

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

    .results-header, .results-body
    {
        list-style: none;
        gap: 0.5em;
        display:flex;
        padding:0;
        margin:0;
        justify-content:unset;
        align-items:center;
        height:3em;
    }

  /*  .results-listing > li:nth-of-type(odd){background-color:#e0eaf4;}*/
    .results-listing * {white-space: nowrap;}

        .results-header *{ color: #000;
            font-family: OpenSans-Regular, sans-serif; font-weight: bold;
        }
        .results-header > li, .results-body > li {flex-wrap: nowrap;min-width:20px;padding:0 0.5rem;}
        .results-listing .actions {width:6%;margin-left: auto;}

        .results-header {background-color: #e0eaf4;
        }
        .results-header a:hover{color: darkorange;transition: color .25s ease, margin .25s ease;}

        .results-body {border-bottom: 1px solid #ddd;}
        .results-body:hover{background-color:rgba(200, 214, 221, 0.41);}
        .results-body .actions ul
        {
            list-style:none;
            margin: 0;
            padding: 0;
            gap:0.5rem;
            display:flex;
            justify-content: center;
            align-items: center;
        }

#waitOverlay
{
    position: fixed;
    z-index: 1000000;
    top: 0;
    left:  0;
    height: 100%;
    width:   100%;
    background: #fff url("/images/icons/ajax-loader.gif") no-repeat center center;
    opacity: 0.8;
}
.notify-save
{
    background-color: var(--gh-alert-color);
    color: white;
}

.dashboards{display: flex; gap: 1rem; padding: 0; margin: 0;}
    .dashboard {width: 30rem;}
    .dashboard h2 {padding: 0;margin:0;}
    .dashboard ul {padding: 0; margin:0;}
    .dashboard ul li {display: flex; gap: 1rem;padding: 0; margin: 0.25rem 0;}
    .dashboard ul li strong
    {
        display: block;
        min-width: 10rem;
    }
    .dashboard ul li span
    {
        display: block;
    }
    .dashboard ul {list-style: none;}
    .dashboard ul li {display: flex; gap: 1rem;}
    .dashboard ul li strong
    {
        display: block;
        min-width: 10rem;
    }
    .dashboard ul li span
    {
        display: block;
    }