@charset "utf-8";
/* @import url('content_styles.css'); */
/* @import url('content.css'); */
/* @import url('suche.css'); */
body {
	font-family: Arial, Verdana, Helvetica, sans-serif;
}
div#center {
	font-size: 12px;
	color: #545455;
	margin-top: 15px;
}
div#center p {
	margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    unicode-bidi: isolate;

}
div#center h1 {
	color:#033B5F;
	font-size:17px;
	font-weight:bold;
	line-height: 20px;
	margin: 1.2em 0 0.6em 0;
	clear:both;
	display:block;
}
div#center h2 {
	color:#EC7A45;
	clear:both;
	display:block;
	font-size:15px;
	font-weight:bold;
	line-height: 17px;
	margin: 1.2em 0 0.6em 0;
}

/* Höhen der fixierten Leisten — bei Bedarf hier anpassen */
:root {
	--head-h: 34px;
	--foot-h: 30px;
}

#parent {
	display: grid;
	grid-template-columns: 0 0 minmax(auto, 800px) 0px auto ;
	/* erste/letzte Zeile auf 0 — Kopf/Fuß sind fixiert (s.u.) und liegen
	   nicht mehr im Scroll-Fluss; das Padding am body schafft den Platz */
	grid-template-rows: 0 minmax(calc(100vh - var(--head-h) - var(--foot-h)), auto) 0;
	grid-column-gap: 0px;
	grid-row-gap: 0px;
}

/* Kopf- und Fußleiste beim Scrollen stehen lassen */
body {
	padding-top: var(--head-h);
	padding-bottom: var(--foot-h);
	box-sizing: border-box;
}

#head { position: fixed; top: 0; left: 0; right: 0;
		z-index: 200;
		min-height: var(--head-h);
		background: #008ac9;
		color: white;
}
#foot { position: fixed; bottom: 0; left: 0; right: 0;
		z-index: 200;
		min-height: var(--foot-h);
}
#left { grid-area: 2 / 2 / 3 / 2; 
		background: #dedede; 
		display: none;
		
}

#center { 
	grid-area: 2 / 3 / 3 / 3; 
	padding: 10px;
}

#right { grid-area: 2 / 4 / 3 / 4; background: gray; display: hide;}

#foot { grid-area: 3 / 1 / 4 / 6; background: #008ac9; display: flex; align-items: center; padding-left: 10px; }

#head .mod-login-logout div{
	display: inline;
}
#mobile_menu {
	display:none;
	position: absolute;
	min-height: 700px;
	width: 200px;
	background: #dedede;
	top: 42px;
	z-index: 50;
	box-shadow: 4px 6px 18px rgba(0, 0, 0, 0.28);
	border-radius: 0 6px 6px 0;
}
#div_menu_button {
	display: block;
	position: absolute;
	left: 5px;
	top: 5px;
	height: 32px;
	background: white;
	border-radius: 5px;
	border: 2px solid #008ac9;
	cursor: pointer;
	transition: background 0.15s ease, box-shadow 0.15s ease, transform 0.1s ease;
}
#div_menu_button:hover {
	background: #eaf6fc;
	box-shadow: 0 2px 6px rgba(0, 138, 201, 0.35);
}
#div_menu_button:active {
	transform: scale(0.92);
}
/* Icon dreht sich leicht, wenn das Menü offen ist */
#div_menu_button a img {
	transition: transform 0.25s ease;
	vertical-align: middle;
}
#div_menu_button a.is-open img {
	transform: rotate(90deg);
}

/*Head*/
#head div.moduletable {
	display: inline-block;
	margin-left: 40px;
}

@media screen and (width >= 600px) { /*grosser Bildschirm*/
	#parent {
		display: grid;
		grid-template-columns: auto 200px minmax(auto, 800px) 0px auto ;
		/* Kopf/Fuß fixiert → erste/letzte Zeile auf 0, Platz schafft body-padding */
		grid-template-rows: 0 minmax(calc(100vh - var(--head-h) - var(--foot-h)), auto) 0;
		grid-column-gap: 0px;
		grid-row-gap: 0px;
	}
	#left {display: grid;}
	#mobile_menu_outer { display:none; }
	#div_menu_button { display: none; }
	div#center {
		margin-top: 0;
	}
	#head div.moduletable {
		margin-left: 0 ;
	}
}


/*Foot*/
#foot div.moduletable, #head div.moduletable {
	color: white;
	font-size: 0.9em;
}
/* Logout-Modul im Head */
#head {
	display: flex;
	align-items: center;
}

.mod-login-logout {
	display: flex;
	align-items: center;
	gap: 0.8em;
	padding: 0 0.8em;
}

.mod-login-logout__login-greeting,
.login-greeting {
	color: white;
}

.mod-login-logout__button .btn-primary {
    background: #e3eef3;
    color: #033B5F;
    border: 1px solid #000000;
    border-radius: 3px;
    padding: 1px 10px;
    font-size: 0.8em;
    cursor: pointer;
    transition: background 0.2s;
}
.mod-login-logout__button .btn-primary:hover {
	background: white;
	color: #008ac9;
}

/*Main-Men�*/
.menu *{list-style:none;}

ul.menu, ul.menu li {
  padding:0;
  margin:0;
}
	
.menu a:link, 
.menu a:visited{  /* Grundformatierung aller Buttons*/  
	display: block;        
	color:#00395D;
	font-size:1em;
	text-decoration: none;
	padding: 0.4em;
	border-bottom: 1px solid #F3F3F3;
	
}

ul.menu li a:hover,
ul.menu li.current li a:hover { /* Hover-Effekt alle Links */
	color:#E85611;
	background-color:inherit;
}

ul.menu li.active a:link, 
ul.menu li.active a:visited { /*Aktivierter Top-Level-Button*/
  background-color:#E7F4FA;  
  /* font-weight:bold; */
}
























*    { 
	margin: 0px; 
	padding: 0px; 
	border: 0px; 
}

html        { height: 100.2%; }

body  {
        background: #F1F9FC;    
}

div#whiteborder {
	background: white;
	width:970px;
	margin:0px;
	font-size:0px;
	line-height:0px;
}
#container {
        width: 950px;
        background: #FFFFFF;
        margin: 10px;
        font-size:12px;
}

#container img { /* �berschreibt img-tags aus der bootstrap Joomla 3.1 */
	max-width:none;
	vertical-align:baseline;
}

#head_logo_ukl {
         position: absolute;
         left: 0px;
         top: 10px;
}
#head_logo_fakultat {
         position: absolute;
         left: 0px;
         top: 57px;
}
#head_logo_slogan {
         position: absolute;
         left: 0px;
         top: 157px;
}
#head_img {
         position: absolute;
         left: 223px;
         top: 0px;
}
#head_signet {
         position: absolute;
         left: 778px;
         top: 42px;
}

#head_menu {
	position:absolute;
	top:22px;
	right:0;
	width:150px;
}

#head_lang {
	position:absolute;
	right:0;
	top:0;
	border-bottom:1px solid #f3f3f3;
	width: 150px;
	height:20px;
}
.mod-languages {
	text-align:right;
}

#head_lang a:link,
#head_lang a:visited {
	padding-bottom:2px;
	border-bottom: 1px solid white;
	width: 18px;
	font-size:0px;
	display:inline;
}
#head_lang a:hover {
	border-bottom: 1px dotted #808285;
}

#head_lang .lang-active a:link,
#head_lang .lang-active a:visited {
	border-bottom:#808285 solid 1px;
}

#neck {
         position:relative;
         width: 100%;
         height: 38px;
         border-top: 1px solid white;
         background: url('../images/bg_hals.png') repeat-x;
}
#neck_name p{
         position:absolute;
         left:8px;
         top:8px;
         color: white;
         font-size: 16px;
		margin:0;
}
#shoulder {
         position: relative;
         width: 100%;
         height: 26px;
         border-bottom: 1px solid #E7F4FA;
}
#shoulder_breadcrumb {
         position: absolute;
         top: 6px;
         left: 8px;
         padding-left: 15px;
         background:url('../images/icon_breadcrumb.gif') no-repeat left center;
         width:700px;
         height:18px;
         overflow:hidden;
         white-space:nowrap;
}

#shoulder_breadcrumb ul {
	padding:0;
	background: white;
}
#shoulder_breadcrumb a:link, 
#shoulder_breadcrumb a:visited,
#shoulder_breadcrumb li {
	text-decoration:none;
	font-size: 11px;
	color: #808285;
	display:inline-block;
	border-bottom: 1px solid white;
	border-top: 1px solid white;
	padding:0;
	line-height:12px;
}
#shoulder_breadcrumb .divider {
	margin: 0 4px;
	padding: 0;
}
#shoulder_breadcrumb a:hover
 {
	border-bottom: 1px dotted #808285;
}


#shoulder_search {
	float:right;
	margin-top:4px;
}
#mod-search-searchword19{
	font-size:10px;
	border:solid 1px #808285;
	color:#808285;
	display:inline;
}
input#mod-search-searchword19 {
	padding:0;
	border-radius: 0px;
	-webkit-border-radius: 0px;
	width: auto;
	height: 13px;
	line-height: normal;
}

.search .button{
	vertical-align:middle;
	margin-left:5px;
	display:inline;
	border:none;
}
#torso {
         width: 100%;
         min-height: 300px;
         position:relative;
}
#torso_left {
         width: 204px;
         float: left;
         margin-top:10px;
}
.menu {margin-top:15px}
#torso_main {
         width: 545px;
         min-height: 500px;
         float: left;
         margin-left:20px;
}
#torso_main.torso_main_alone {
         width: 650px;
}
#torso_right {
         width: 160px;
         float: right;
}
ul.weblinks li{
	list-style-type: none;
	background: url('../images/bg_sidebar_item.gif') right bottom no-repeat;
	border: 1px solid #436D88;
	margin:10px 0 10px 0;
}

ul.weblinks a:link,
ul.weblinks a:visited {
	display:block;
	background: url('../images/arrow_gelb.png') left center no-repeat #436D88;
	color:#fff;
	font-size:13px;
	font-weight:bold;
	text-decoration:none;
	padding:5px 3px 3px 11px;	
}
ul.weblinks a:hover {
	text-decoration:underline;
}
ul.weblinks p {
	font-size:11px;
	color:#545455;
	margin:3px;
}
	

#foot_menu {
	float:right;
}


.inputbox, textarea, select {
	border:1px solid #808285;
	font-size:13px;
	display:block;
}
fieldset legend{
	font-size:13px;
	text-decoration:underline;
}
fieldset label, .optional{

}
button {
	border:1px solid #333;
	padding:2px;
	background:#eee;
	margin:1px;
}

/* Edit-Button */
ul.actions {
list-style:none;
}
/*Tool-Tips
Struktur:
<div class="tip-wrap">
    <div class="tip-top"></div>
    <div class="tip">
        <div class="tip-title"></div>
        <div class="tip-text"></div>
    </div>
    <div class="tip-bottom"></div>
</div>
*/
.tip-wrap {
	background:white;
	border:1px solid #333;
	display:block;
}
.tip-title {
	color:#555;
	font-size:10px;
	text-decoration:underline;
}
.tip-text {
	color:#888;
	font-size:10px;
}

/* Mitarbeiterseite */
div.contact-row {
	display:block;
	position:relative;
	margin-bottom:15px;
	width:550px;
}
.contact-image img {
	margin:0;
	padding:0;
}
div.contact-image {
	float:left;
	border: 1px dotted grey;
	width:75px;
	background:url('../images/dummy_75px.gif');
	font-size:0px;
}
div.contact-image-spacer {
	height:100px;
}
div.contact-div-name {
	margin-left:85px;
	width:auto;
}
a.contact-name ,
a.contact-name:link,
a.contact-name:visited {
	position:relative;
	display:block;
	background:url('../images/email.png') right center no-repeat #436D88;
	background-color: #436D88;
	color:white;
	font-weight:bold;
	padding:3px;
	text-decoration:none;
}
a.contact-name:hover {
	text-decoration:underline;
	color:white;
}
	
div.contact-misc {
	position:relative;
	background:#C1C1C1;
	color:#545455;
	padding:3px;
	min-height:50px;
}
div.contact-misc p {
	margin: 2px 0 2px 0;
}
/*Editor-Zeugs*/
div.button2-left{
	display:inline-block;
	background:#eee;
	border:1px solid #ccc;
	padding:3px 10px 3px 10px;
}
#system-message    { margin: 10px 0; padding: 0;}
#system-message dt { font-weight: bold;  display: none; }
#system-message dd { margin: 0; font-weight: bold; }
#system-message dd ul { color: #0055BB; margin-bottom: 10px; list-style: none; padding: 10px; border-top: 3px solid #84A7DB; border-bottom: 3px solid #84A7DB;}
#system-message dd ul li{ line-height:1.5em }

/* System Standard Messages */
#system-message dd.message ul {
    background-color: #C3D2E5;
}

/* System Error Messages */
#system-message dd.error ul,
#system-message dd.warning ul,
#system-message dd.notice ul
{
    color: #c00;
}

#system-message dd.error ul {
    background-color: #E6C0C0;
    border-top-color: #DE7A7B;
    border-bottom-color: #DE7A7B;
}

/* System Warning Messages */
#system-message dd.warning ul {
    color: #c00;
    background-color: #E6C8A6;
    border-top-color: #FFBB00;
    border-bottom-color: #FFBB00;
}

/* System Notice Messages */
#system-message dd.notice ul {
    color: #c00;
    background-color: #EFE7B8;
    border-top-color: #F0DC7E;
    border-bottom-color: #F0DC7E;
}
#member-registration input {
	font-size:13px;
	padding:2px;
}

#member-registration  input.invalid  {
	border: 1px red solid;
}
#member-registration dd {
	display:inline-block;
	border:solid 1px #808285;
}
table#table_frontend_user_article_list ul li a,
table#table_frontend_user_article_list ul li span{
	list-style-type:none;
	display:inline-block;
	margin:2px;
	padding:3px;
	border:1px grey solid;		
	min-width:19px;
	text-decoration:none;
}
table#table_frontend_user_article_list ul li {display:inline-block;}

/* ===== Login-Seite ===== */
.com-users-login {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-height: 80vh;
}

.com-users-login__container,
form#member-login {
	background: white;
	border-top: 4px solid #008ac9;
	border-radius: 4px;
	box-shadow: 0 2px 12px rgba(0,0,0,0.12);
	padding: 2em 2.5em;
	min-width: 320px;
	max-width: 400px;
	width: 100%;
}

.com-users-login .com-users-login__description {
	font-size: 1.4em;
	color: #008ac9;
	font-weight: bold;
	margin-bottom: 1em;
	text-align: center;
}

.com-users-login__container legend,
form#member-login legend {
	font-size: 1.2em;
	font-weight: bold;
	color: #033B5F;
	text-decoration: none;
	margin-bottom: 1.2em;
	display: block;
}

.com-users-login label {
	display: block;
	font-size: 0.85em;
	color: #555;
	margin: 1em 0 0.3em 0;
}

.com-users-login input[type=text],
.com-users-login input[type=password],
.com-users-login input[type=email] {
	width: 100%;
	padding: 0.5em 0.7em;
	border: 1px solid #b0cfe0;
	border-radius: 3px;
	font-size: 1em;
	box-sizing: border-box;
	transition: border-color 0.2s;
}

.com-users-login input[type=text]:focus,
.com-users-login input[type=password]:focus {
	border-color: #008ac9;
	outline: none;
}

.com-users-login .form-check {
	display: flex;
	align-items: center;
	gap: 0.5em;
	margin-top: 0.8em;
}

.com-users-login .form-check-input {
	width: auto;
	margin: 0;
}

.com-users-login .form-check-label {
	margin: 0;
	font-size: 0.85em;
	color: #555;
}

.com-users-login .input-group {
	display: flex;
	align-items: stretch;
	gap: 4px;
}

.com-users-login .input-group input[type=password] {
	flex: 1;
	border-radius: 3px;
}

.com-users-login .input-password-toggle {
	border: 1px solid #b0cfe0;
	border-radius: 3px;
	background: #f0f0f0;
	padding: 0 0.7em;
	cursor: pointer;
	color: #555;
}

.com-users-login .input-password-toggle .visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	white-space: nowrap;
	border: 0;
}

.com-users-login .input-password-toggle:hover {
	background: #e0e0e0;
}

.com-users-login .input-password-toggle .icon-eye::before {
	content: "👁";
	font-style: normal;
}

.com-users-login .input-password-toggle .icon-eye-close,
.com-users-login .input-password-toggle .icon-eye-slash {
	position: relative;
	display: inline-block;
}

.com-users-login .input-password-toggle .icon-eye-close::before,
.com-users-login .input-password-toggle .icon-eye-slash::before {
	content: "👁";
}

.com-users-login .input-password-toggle .icon-eye-close::after,
.com-users-login .input-password-toggle .icon-eye-slash::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	height: 2px;
	background: currentColor;
	transform: rotate(-45deg);
	transform-origin: center;
}

.com-users-login .btn-primary,
.com-users-login input[type=submit],
.com-users-login button[type=submit] {
	display: block;
	width: 100%;
	margin-top: 1.4em;
	padding: 0.6em;
	background: #008ac9;
	color: white;
	border: none;
	border-radius: 3px;
	font-size: 1em;
	cursor: pointer;
	transition: background 0.2s;
}

.com-users-login .btn-primary:hover,
.com-users-login input[type=submit]:hover,
.com-users-login button[type=submit]:hover {
	background: #033B5F;
}

.com-users-login .com-users-login__options {
	display: block;
	width: 100%;
	max-width: 400px;
	margin-top: 0.8em;
	font-size: 0.82em;
	text-align: center;
	border: none;
	padding: 0;
}

.com-users-login .com-users-login__options a,
.com-users-login .com-users-login__options a.list-group-item {
	display: block;
	color: #008ac9;
	text-decoration: none;
	padding: 0.3em 0;
	border: none;
	background: none;
}

.com-users-login .com-users-login__options a:hover {
	text-decoration: underline;
	background: none;
}