/* @override https://cfg.jit-creatives.de/wi_format.css */

/* Menu: alles was mit der Navigation zu tun hat */


#menu {
  	position:absolute;
  	top:80px;
  	left:8px;
  	width:9em;
  	padding: 5px 5px 15px 1em;
  	background-color: #fff;
  	text-align: left;
	margin: 0;
	font-size: 14px;
}

#logo {
	position:absolute;
  	top:8px;
  	left:8px;
  	width: 9em;
	height: 100px;
	background-color: white;
	overflow: hidden;
}

.menu1 {
	padding-top: 0em;
}

.menu2 {
	padding-top: 1.5em;
}

/*das sind die zwei Menuuberschriften*/
.domain {
	margin-top: 3em;
	text-align: left;
	font: 8pt "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	padding-top: 0.3em;
	padding-bottom: 0.5em;
	border-top-style: dotted;
	border-top-width: 1px;
}

.font {
	text-align: left;
	font: 8pt "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	padding-top: 0.3em;
	padding-bottom: 0.5em;
	border-top-style: dotted;
	border-top-width: 1px;
}



#logout {
	margin-top: 3em;
	border-top-style: dotted;
	border-top-width: 1px;
}



#cfgmenu {
	
}


#menu a:link { 
	font-weight: bold; 
	color: black; 
	text-decoration:none;
	font-family: "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	text-align: left;
}

#menu a:visited { 
	font-weight:bold; 
	color: #952D3F; 
	text-decoration:none; }

#menu a:focus { 
	font-weight:bold; 
	color: black; 
	text-decoration:underline; }
	
#menu a:hover { 
	font-weight:bold; 
	color: #E67E04; 
	text-decoration:none; }
	
#menu a:active { 
	font-weight:bold; 
	color: #E67E04; 
	text-decoration:underline; }







/* Main: alles was mit dem eigentlichen Inhalt zu tun hat*/
 
font {
	font: 10pt "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
} 
 
table {
	font: 10pt "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
} 
 
#maindiv {
  padding:0.3em;
  margin-left: 11.3em;
  overflow:hidden;
  background-color: silver;
	font: 10pt "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}
 
#inprogress {
  position: absolute;
  top: 45%;
  left: 45%; 
  overflow: auto;
}
 
#head {
  padding:0.4em;
  margin-left:11.3em;
/*  background-color:#949494; */
  background-color: #C8D54F; 
  overflow:hidden;
	font: 10pt "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}
#bottom {
  padding:0.3em;
  margin-left:11.3em;
/*  background-color:#8C8C8C; */
  background-color: silver;
  overflow:hidden;
	font: 10pt "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}
#admin {
  margin-top:20px;
  padding:0 1em;
  margin-left:8.5em;
  overflow:hidden;
	background-color: #E67E04;
}
#status {
  text-align: center;
  margin-top:20px;
  padding: 0.3 0.3em; 
  margin-left:9.5em;
  overflow:hidden;
	font: 10px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}
body {
	font-family: "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	background: #ddd none repeat scroll;
}

#domainlist font {
	font-family: "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	text-align: left;
}

/* Modern cfg start/login */

:root {
	--jit-ink: #202421;
	--jit-muted: #666d66;
	--jit-panel: #ffffff;
	--jit-line: #d8ddd4;
	--jit-green: #c8d54f;
	--jit-orange: #e67e04;
	--jit-red: #952d3f;
	--jit-bg: #f3f5f1;
}

* {
	box-sizing: border-box;
}

body {
	color: var(--jit-ink);
	background: var(--jit-bg);
	line-height: 1.45;
}

a {
	color: var(--jit-red);
}

a:hover {
	color: var(--jit-orange);
}

.login-page {
	min-height: 100vh;
	margin: 0;
	background:
		linear-gradient(90deg, rgba(200, 213, 79, 0.16), transparent 42%),
		var(--jit-bg);
}

.login-shell {
	display: grid;
	grid-template-columns: minmax(280px, 390px) minmax(280px, 520px);
	gap: 32px;
	align-items: stretch;
	width: min(980px, calc(100vw - 40px));
	min-height: 100vh;
	margin: 0 auto;
	padding: 56px 0;
}

.login-card,
.login-news,
.logout-card {
	align-self: center;
	background: var(--jit-panel);
	border: 1px solid var(--jit-line);
	border-radius: 8px;
	box-shadow: 0 18px 42px rgba(32, 36, 33, 0.08);
}

.login-card {
	padding: 34px;
}

.logout-shell {
	display: grid;
	place-items: center;
	width: min(100% - 40px, 460px);
	min-height: 100vh;
	margin: 0 auto;
	padding: 40px 0;
}

.logout-card {
	width: 100%;
	padding: 34px;
}

.logout-card h1 {
	margin: 0;
	font-size: 30px;
	letter-spacing: 0;
}

.logout-card p:not(.eyebrow) {
	margin: 12px 0 26px;
	color: var(--jit-muted);
	font-size: 16px;
}

.primary-action {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 10px 16px;
	color: #fff;
	background: var(--jit-ink);
	border-radius: 6px;
	font-weight: 700;
	text-decoration: none;
}

.primary-action:hover {
	color: #fff;
	background: var(--jit-orange);
	text-decoration: none;
}

.login-logo {
	display: block;
	width: min(241px, 100%);
	height: auto;
	margin-bottom: 32px;
}

.eyebrow {
	margin: 0 0 8px;
	color: var(--jit-red);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0;
	text-transform: uppercase;
}

.login-card h1,
.login-news h2,
.welcome-panel h1 {
	margin: 0;
	color: var(--jit-ink);
	font-weight: 700;
	letter-spacing: 0;
}

.login-card h1 {
	font-size: 32px;
}

.login-form {
	display: grid;
	gap: 16px;
	margin-top: 28px;
}

.login-form label {
	display: grid;
	gap: 6px;
	color: var(--jit-muted);
	font-size: 13px;
	font-weight: 700;
}

.login-form input[type="text"],
.login-form input[type="password"] {
	width: 100%;
	min-height: 42px;
	padding: 9px 11px;
	color: var(--jit-ink);
	background: #fbfcfa;
	border: 1px solid #cbd2c7;
	border-radius: 6px;
	font: 15px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}

.login-form input[type="text"]:focus,
.login-form input[type="password"]:focus {
	outline: 2px solid rgba(200, 213, 79, 0.65);
	border-color: #9eaa33;
}

.login-form input[type="submit"] {
	min-height: 44px;
	margin-top: 6px;
	padding: 10px 16px;
	color: #fff;
	background: var(--jit-ink);
	border: 0;
	border-radius: 6px;
	font: 700 15px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	cursor: pointer;
}

.login-form input[type="submit"]:hover {
	background: var(--jit-orange);
}

.login-news {
	padding: 34px;
}

.login-news h2 {
	font-size: 26px;
}

.notice-grid {
	display: grid;
	gap: 16px;
	margin-top: 22px;
}

.notice-item {
	display: grid;
	gap: 4px;
	padding-left: 14px;
	border-left: 4px solid var(--jit-green);
}

.notice-item:nth-child(2) {
	border-left-color: var(--jit-orange);
}

.notice-item:nth-child(3) {
	border-left-color: var(--jit-red);
}

.notice-item strong,
.feature-list strong {
	font-size: 15px;
	color: var(--jit-ink);
}

.notice-item span,
.support-note,
.welcome-copy,
.feature-list span {
	color: var(--jit-muted);
}

.support-note {
	margin: 24px 0 0;
	padding-top: 18px;
	border-top: 1px solid var(--jit-line);
	font-size: 14px;
}

.legal-links {
	position: fixed;
	right: 18px;
	bottom: 12px;
	z-index: 20;
	display: inline-flex;
	gap: 10px;
	padding: 6px 8px;
	background: rgba(243, 245, 241, 0.78);
	border-radius: 6px;
	font-size: 11px;
	line-height: 1;
}

.legal-links a {
	color: rgba(32, 36, 33, 0.58);
	text-decoration: none;
}

.legal-links a:hover {
	color: var(--jit-orange);
	text-decoration: underline;
}

.app-shell {
	margin: 0;
	background: var(--jit-bg);
}

.app-shell #logo {
	top: 16px;
	left: 16px;
	width: 226px;
	height: auto;
	padding: 12px;
	background: var(--jit-panel);
	border: 1px solid var(--jit-line);
	border-radius: 8px;
	box-shadow: 0 10px 24px rgba(32, 36, 33, 0.06);
}

.app-shell #logo img {
	display: block;
	width: 100%;
	height: auto;
}

.app-shell #menu {
	top: 100px;
	left: 16px;
	width: 226px;
	padding: 14px;
	background: var(--jit-panel);
	border: 1px solid var(--jit-line);
	border-radius: 8px;
	box-shadow: 0 10px 24px rgba(32, 36, 33, 0.06);
}

.app-shell #menu a:link,
.app-shell #menu a:visited {
	color: var(--jit-ink);
}

.app-shell #menu a:hover,
.app-shell #menu a:active {
	color: var(--jit-orange);
}

.app-shell #head,
.app-shell #maindiv,
.app-shell #bottom,
.app-shell #admin,
.app-shell #status {
	margin-left: 276px;
	margin-right: 24px;
	border-radius: 8px;
}

.app-shell #head {
	min-height: 38px;
	background: var(--jit-green);
	border: 1px solid rgba(32, 36, 33, 0.08);
}

.app-shell #maindiv,
.app-shell #bottom {
	background: transparent;
}

.app-shell #maindiv {
	min-height: 260px;
	padding: 0;
}

.welcome-panel {
	max-width: 900px;
	padding: 34px;
	background: var(--jit-panel);
	border: 1px solid var(--jit-line);
	border-radius: 8px;
	box-shadow: 0 16px 34px rgba(32, 36, 33, 0.07);
}

.welcome-panel h1 {
	font-size: 30px;
}

.welcome-copy {
	max-width: 620px;
	margin: 12px 0 26px;
	font-size: 16px;
}

.feature-list {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
}

.feature-list div {
	display: grid;
	gap: 6px;
	min-height: 112px;
	padding: 16px;
	background: #fbfcfa;
	border: 1px solid var(--jit-line);
	border-top: 4px solid var(--jit-green);
	border-radius: 8px;
}

.feature-list div:nth-child(2) {
	border-top-color: var(--jit-orange);
}

.feature-list div:nth-child(3) {
	border-top-color: var(--jit-red);
}

.app-shell #bottom {
	margin-top: 16px;
	padding: 16px;
}

.app-shell #admin {
	background: #fff7ed;
	border: 1px solid #f0c798;
}

.app-shell #status {
	padding: 10px 14px;
	color: var(--jit-muted);
	background: transparent;
}

.cfg-select-form {
	margin: 0 0 12px;
}

.cfg-select {
	width: min(100%, 320px);
	padding: 8px 10px;
	color: var(--jit-ink);
	background: var(--jit-panel);
	border: 1px solid var(--jit-line);
	border-radius: 6px;
	font: 14px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}

.cfg-domain-select {
	min-width: 220px;
}

.cfg-page-title {
	margin: 0 0 16px;
	font-size: 18px;
	font-weight: 700;
}

.cfg-panel {
	margin: 0 0 16px;
	padding: 14px;
	background: var(--jit-panel);
	border: 1px solid var(--jit-line);
	border-radius: 8px;
}

.cfg-panel h3 {
	margin: 0 0 10px;
	font-size: 15px;
}

.cfg-table-scroll {
	max-height: 360px;
	overflow: auto;
	border: 1px solid var(--jit-line);
	border-radius: 6px;
	background: #fff;
}

.cfg-list-table {
	width: 100%;
	border-collapse: collapse;
}

.cfg-list-table td,
.cfg-list-table th {
	padding: 8px 10px;
	border-bottom: 1px solid var(--jit-line);
	vertical-align: top;
}

.cfg-list-table tr:nth-child(even) {
	background: #f8faf5;
}

.cfg-list-table textarea {
	width: min(100%, 720px);
	max-width: 100%;
	font: 12px monospace;
}

.cfg-notice {
	margin: 12px 0 16px;
	padding: 14px;
	background: #fbfcdf;
	border: 1px solid #d8df77;
	border-radius: 8px;
}

.cfg-notice p {
	margin: 6px 0 10px;
}

.cfg-action-link {
	display: inline-block;
	padding: 7px 11px;
	color: #fff;
	background: var(--jit-red);
	border-radius: 6px;
	text-decoration: none;
	font-weight: 700;
}

.cfg-action-link:hover {
	color: #fff;
	background: var(--jit-orange);
}

@media (max-width: 780px) {
	.login-shell {
		grid-template-columns: 1fr;
		width: min(100% - 24px, 520px);
		padding: 24px 0;
	}

	.login-card,
	.login-news,
	.logout-card,
	.welcome-panel {
		padding: 24px;
	}

	.app-shell #logo,
	.app-shell #menu {
		position: static;
		width: auto;
		margin: 12px;
	}

	.app-shell #head,
	.app-shell #maindiv,
	.app-shell #bottom,
	.app-shell #admin,
	.app-shell #status {
		margin-left: 12px;
		margin-right: 12px;
	}

	.feature-list {
		grid-template-columns: 1fr;
	}
}