:root { /* will be overridden by JS */
    --size:  0.5;
    --width: 1;
}

@font-face { 
        font-family: 'humanst';
        src: url('../fonts/Humanist521BT_Light.ttf') format('truetype'); 
}
@font-face { 
        font-family: 'humanstbt';
        src: url('../fonts/Humanist521BT_Roman.ttf') format('truetype'); 
}

/*Globale Stile*/
html, body, #canvas {
	height: 100%;
	margin: 0;
	padding: 0;
	width: 100%;
}
body {
	background: url("../layout/body_bg_bw.gif") top left repeat-x white;	
}
fieldset {
	border : 1px solid #444444;
	background: url("../layout/form_bg.gif") bottom right repeat-y transparent;
	color:#888888;
	text-align: left;
	font-size: 0.8em;
	margin-left:31px;
	margin-right:15px;
	padding-left: 18px;
	padding-right: 18px;
}
form {
	margin: 0px;
	text-align: right;
}
h1, h2, h3, h4  {
	font-family: Humanst521 BT, Times New Roman, Times, times, serif
	/*text-align: center;  /* Zentrierung im Internet Explorer */
}
h5, h6, p, li, input, button, textarea, select, label, legend, div, td, th {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	/*text-align: center;  /* Zentrierung im Internet Explorer */
}
label {
	font-size: 1em;
	color: gray;
	font-weight: bold;
}
input { 
	min-height: 1.1em;
    line-height:  1.1em;
    font-size: 0.8em;
}
input[type=text],
input[type=integer]  { /*fuer den Formulartester nextform() */
	border-color: silver;
}
input[type=file] { /*fuer den Formulartester nextform() */
	height: 1.5em;
	border-color: silver;
}
input[type=button] { /*fuer den Formulartester nextform() */
	height: 2.5em;
	border-color: silver;
}
select {
	height: 1.7em;
    font-size: 0.8em;
}
textarea { 
    line-height: 1.1em;
}
button {
    height: 2.5em;
    /*line-height: 2.5em;*/
	color: #888888;
	margin: 5px;
	margin-right: 20px;
	font-size: 0.8em;
}
div  {
	font-family: Humanst521 BT, Times New Roman, Times, times, serif;
}
hr {
	color: silver; 
	background-color: silver; 
	height: 1px;
	border: 1px white;
	margin-left: 15px;
	margin-right: 15px;
}

a:link { 
	text-decoration:none; 
	font-weight:normal; 
	color: #000;
}
a:visited { 
	text-decoration:none; 
	font-weight:normal; 
	color:#000; 
}
a:hover { 
	text-decoration:underline; 
	font-weight:bold; 
	color:#999999; 
	background-color:#fff; 
}
a:active { 
	text-decoration:underline; 
	font-weight:bold; 
	color:#999999; 
	background-color:#160877;
}
a:focus { 
	text-decoration:underline; 
	font-weight:bold; 
	background-color:#3f4aa4; 
}
.bar {  
	font-size: 0.5em;
	font-weight: bold;
	color: #f4f4ff;
	margin-left: 18px;

}

.abstand { 
	margin-top: 10px;
	margin-left: 18px; /* passend zu headline */
	margin-right: 18px;
}
.hell {
    background: #ddd;
}
.dunkel {
    background: #999;
}
.grund {
    background: #444;
}
.button {
	background: #666;
    background-size: cover;
	color: #aaa;
	margin:5px;
	margin-right: 20px;	
    border: 1px solid #cecece;
    
    -moz-box-shadow:    2px 2px 5px 0 #b3b3b3;
	-webkit-box-shadow: 2px 2px 5px 0 #b3b3b3;
	box-shadow:         2px 2px 5px 0 #b3b3b3;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
    
    min-width: 3em;
    min-height: 1em;
    font-size:0.8em;
	font-style: Garamond, Verdana, Arial, Helvetica, sans-serif;
	font-weight:bold;
}
.button:hover {
	background: silver;
	color: #444;
}
.button:active {
	color: #444;
}

.comment {
	font-size: 0.7em;
	margin-bottom: 0.4em;
	text-align: left;
}

.box{
	color: #333333;
	width: 500px;
	margin: 0 auto 0 auto;
	padding: 10px 10px 10px 10px;
	border: 1px solid #cecece;

	-moz-box-shadow:    2px 2px 5px 0 #b3b3b3;
	-webkit-box-shadow: 2px 2px 5px 0 #b3b3b3;
	box-shadow:         2px 2px 5px 0 #b3b3b3;

	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;

	background:white;

	font: bold 10pt verdana, sans-serif;
	position: relative;
}

.vertragsart {
    display:none;
}

.price {
    background: url("../layout/price_bw.png") center right no-repeat transparent;
    background-size: cover;
    width: 2.8em; 
    height: 1.0em;
    padding-top: 0.3em;
    padding-bottom: 0.2em;
    padding-right:0.4em;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 2em;
	text-align: right;
	font-weight: bold;
    text-shadow: 1px 1px gray;
    color: black;    
}

#cookie-statement {
	display: none;
}
#cookie-statement span {
	display: none;
}
#cookie-statement a {
	display: none;
}

#menu a {	
	display: inline-block;
	position: absolute;
	top: 25px;
	right: 25px;
	cursor: pointer;
	display: none;
	background-color:#303030;
	border:1px solid rgba(0,0,0,1);
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	color:#fff;
	cursor:pointer;
	padding:4px 8px;
	margin-top:4px;
	text-align:center;
}

/*Sonderseite*/

div#feld { 
    box-sizing: border-box;
    background-image: linear-gradient(to right, white 0%, gray 50%);
    transition: background-color 0.5s ease;
    width: 80%;
    max-width: 300px;
    padding: 2em;
    border : 1px solid #b3b3b3;
    border-radius: calc(var(--width) * 0.4em);
}

/*Begin of page*/

div#info { 
	display:none; 
	min-width: 16em; /* Mindestbreite (der Ueberschrift) verhindert Anzeigefehler in modernen Browsern */
}


table#main { 
	display: none;
}
table#bar {
	display: none;
}
table#content {
	border: none;
	border-collapse: collapse;
	margin-top: 100px;
	max-width: 1100px;
	padding: 0;
	width: 100%;
}
div {
	margin: 0;
	border: 0;
	padding: 0;
	text-align: left;
	vertical-align: top;
}

div#logo {
	background: url("../layout/iustus_bw.png") top right no-repeat transparent;
	position: absolute;
	top: 0;
	width: 100%;
	height: 183px;
	max-width: 1100px; 
	text-align: right;
	cursor: pointer;
	z-index:-1;
}
div#logo img {
        display: none;
}


/*Content for short texts barrier free*/

div#content {
    /*Push Content away from Logo*/
	top: 33px;
	position: relative;
	clear: left;
	background-color: #fff;
	margin: 150px 0 0 0; 
	border: 0;
	padding: 0;
	text-align: left;    /* Seiteninhalt wieder links ausrichten */
	width: 100%;
	max-width: 1100px;
	height:100%;
	min-height: 1000px;
}


/*Content left Bar*/

div#bars {
	display:none;
}


/*Content Text*/

div#text {
	background-color: #fff;
	margin: 0 180px 0 75px;
	padding: 8px 0 18px 0;
	height: 100%;
}
div#text #headline {
	text-shadow: black 3px 2px 4px;
	text-decoration: none; 
	font-weight: none;
	font-size: 2.4em;
	color: black;
	margin-top: 8px;
	margin-left: 31px;
}
div#text #subline {
	text-decoration: none; 
	font-weight: normal;
	font-size: 0.9em;
	color: black;
	margin-top: 8px;
	margin-left: 35px;
}
div#text #error {
	text-shadow: black 3px 2px 4px;
	text-decoration: none; 
	font-weight: none;
	font-size: 2.4em;
	color: #ee0000;
	margin-top: 0px;
	margin-left: 31px;
}
div#text #intro {
	text-align: left;
	text-decoration: none; 
	font-weight: none;
	font-size: 0.7em;
	color: black;
	line-height: 1.1em;
	margin: 1.0em 25px 1.0em 310px;
}
div#text #chapter {
	text-align: left;
	text-decoration: none; 
	font-weight: bold;
	font-size: 1.0em;
	color: black;
	background: #ddd;
	line-height: 1em;
	margin: 1.8em 23px 0.7em 23px;
	padding: 0.5em
}
div#recommend {
	display: none;
}
div#text p {
	text-align: left;
	text-decoration: none; 
	font-weight: none;
	font-size: 0.8em;
	color: black;
	line-height: 1.1em;
	margin: 1.0em 23px 0.9em 25px;
}
div#text li {
	text-align: left;
	text-decoration: none; 
	font-weight: none;
	font-size: 0.8em;
	color: #000000;
	line-height: 1.1em;
	margin: 0 23px 0 25px;
}
div#text th {
    background: #ddd;
	text-decoration: none; 
	font-weight: normal;
	font-size: 0.8em;
	color: #000000;
}
div#text td#case {
    background-color: #ddd;
	font-weight: normal;
	font-size: 0.8em;
}
div#text form {
}
div#text select {
	background: #fff;
	scrollbar-3dlight-color: #fff;
	scrollbar-arrow-color: black;
	scrollbar-base-color: #fff;
	scrollbar-darkshadow-color: #fff;
	scrollbar-face-color: #fff;
	scrollbar-highlight-color: #fff;
	padding: 2px;
	border-style: ridge;
	border-width: thin;
	border-color: silver;
	margin-top: 2px;
	margin-bottom: 2px;
	text-align:left;
}
div#text input {
	padding: 2px;
	border-style: ridge;
	border-width: thin;
	border-color: silver;
	margin-top: 2px;
	margin-bottom: 2px;
	text-align: left;
}
div#text textarea {
	padding: 2px;
	border-style: ridge;
	border-width: thin;
	border-color: silver;
	text-align: left;
	font-size:0.8em;
}


/*Content Table for longer texts*/


table#content td#borderleft {
	display: none;
}
table#content td#bars {
	display: none;
}
table#content td#logoclear {
	height: 82px;
}
table#content td#text table {
	text-align: left;    /* Seiteninhalt wieder links ausrichten */
}
table#content td#text #headline {
	text-shadow: black 3px 2px 4px;
	text-decoration: none; 
	font-weight: normal;
	font-size: 2.4em;
	color: black;
	margin-top: 0px;
	margin-left: 31px;
}
table#content td#text #subline {
	text-decoration: none; 
	font-weight: normal;
	font-size: 0.9em;
	color: black;
	margin-top: 8px;
	margin-left: 35px;
}
table#content td#text #error {
	text-shadow: black 3px 2px 4px;
	text-decoration: none; 
	font-weight: normal;
	font-size: 2.4em;
	color: black;
	margin-top: 0px;
	margin-left: 18px;
}
table#content td#text #intro {
	text-decoration: none; 
	font-weight: normal;
	font-size: 0.7em;
	color: black;
	line-height: 1.1em;
	margin-top: 1.0em;
	margin-left: 310px;
	margin-right: 25px;
	margin-bottom: 1.0em;
}
table#content td#text #chapter {
	text-decoration: none; 
	font-weight: bold;
	font-size: 1.0em;
	color: black;
	background: #ddd;
	line-height: 1.2em;
	margin-top: 1.8em;
	margin-left: 20px;
	margin-right: 23px;
	margin-bottom: 0.7em;
	padding: 0.5em
}
table#content td#text p {
	text-decoration: none; 
	font-weight: normal;
	font-size: 0.8em;
	color: #000000;
	line-height: 1.1em;
	margin-top: 1.0em;
	margin-left: 23px;
	margin-right: 25px;
	margin-bottom: 0.9em;
}
table#content td#text li {
	text-decoration: none; 
	font-weight: normal;
	font-size: 0.8em;
	color: #000000;
	line-height: 1.1em;
	margin-left: 23px;
	margin-right: 25px;
}
table#content td#text th {
    background: #ddd;
	text-decoration: none; 
	font-weight: normal;
	font-size: 0.8em;
	color: #000000;
}
table#content td#text td#case {
    background-color: #ddd;
	font-weight: normal;
	font-size: 0.8em;
}
table#content #recommend {
	display: none;
	margin-top: 0px;
	margin-left: 31px;
}
table#content form {
}
table#content select {
	background: #fff;
	scrollbar-3dlight-color: #fff;
	scrollbar-arrow-color: black;
	scrollbar-base-color: #fff;
	scrollbar-darkshadow-color: #fff;
	scrollbar-face-color: #fff;
	scrollbar-highlight-color: #fff;
	padding: 2px;
	border-style: ridge;
	border-width: thin;
	border-color: silver;
	margin-top: 2px;
	margin-bottom: 2px;
	text-align:left;
}
table#content input {
	padding: 2px;
	border-style: ridge;
	border-width: thin;
	border-color: silver;
	margin-top: 2px;
	margin-bottom: 2px;
}
table#content textarea {
	padding: 2px;
	border-style: ridge;
	border-width: thin;
	border-color: silver;
	font-size:0.8em;
}


/*Content Links for short texts barrier free*/

div#text a#linkout:hover {
	background: url("../layout/link_out.gif") center left no-repeat transparent;
	padding-left: 10px;
}
div#text a#linkin:hover {
	background: url("../layout/link_in.gif") center left no-repeat transparent;
	padding-left: 10px;
}


/*Content Links for longer texts*/

table#content td#text a#linkout:hover {
	background: url("../layout/link_out.gif") center left no-repeat transparent;
	padding-left: 10px;
}
table#content td#text a#linkin:hover {
	background: url("../layout/link_in.gif") center left no-repeat transparent;
	padding-left: 10px;
}

/*Content Functions for short and longer texts*/

li#zoom {
	float: right; 
	width: 8em;
}
li#zoom a {
	background: url("../layout/ico_zoom_0.gif") center left no-repeat transparent;
}
li#zoom a:hover {
	background: url("../layout/ico_zoom_1.gif") center left no-repeat transparent;
}
li#home {
	float: right; 
	width: 8em;
}
li#home a {
	background: url("../layout/ico_home_0.gif") center left no-repeat transparent;
}
li#home a:hover {
	background: url("../layout/ico_home_1.gif") center left no-repeat transparent;
}
li#print {
	float: left; 
	width: 10em;
}
li#print a {
	background: url("../layout/ico_print_0.gif") center left no-repeat transparent;
}
li#print a:hover {
	background: url("../layout/ico_print_1.gif") center left no-repeat transparent;
}
li#envelope {
	float: left; 
	width: 15em;
}
li#envelope a {
	background: url("../layout/ico_envelope_0.gif") center left no-repeat transparent;
}
li#envelope a:hover {
	background: url("../layout/ico_envelope_1.gif") center left no-repeat transparent;
}
li#feedback {
	float: left; 
	width: 10em;
}
li#feedback a {
	background: url("../layout/ico_feedback_0.gif") center left no-repeat transparent;
}
li#feedback a:hover {
	background: url("../layout/ico_feedback_1.gif") center left no-repeat transparent;
}
li#top {
	float: right; 
	width: 8em;
}
li#top a {
	background: url("../layout/ico_arrow_up_0.gif") center left no-repeat transparent;
}
li#top a:hover {
	background: url("../layout/ico_arrow_up_1.gif") center left no-repeat transparent;
}

ul div {
	clear: left;
}


/*Content Functions for short texts barrier free */

div#text #functions ul {
	display:none;
}
ul div {
	clear: left;
}


/*Content Functions for longer texts*/

table#content td#text #functions ul {
	display:none;
}
	

/*Navigation for short texts barrier free*/

div#navigation {
    /* kein zusaetzlicher Abstandhalter zum Logo*/
	top: 0;
	position: relative;
	background: #ddd;
	margin-right: 7px;
	float: right;
	width: 173px;
	height: 100%;
}
div#navigation #datum {
	background: #ddd;
	margin-top:30px;
	text-align: center;
	font-size: 0.8em;
	color: black;
	filter:DropShadow(color=#C0C0C0, offx=1px, offy=1px);
	width:171px;
}
div#navigation #fontsize {
	text-align: center;
	margin-top:10px;
	color: gray;
	width:171px;
}
div#navigation ul {
	/*background: #dedaec;*/
	padding-left: 1px;
	list-style-type:square;/*list-style: none;*/
	font-size: 0.8em;
}
div#navigation ul li {
	padding: 3px 2px 3px 10px;
	font-weight: bold; 
	text-decoration: none; 	
	text-align: left;
	color: white;
}
div#navigation ul li:hover  {
	background-color: #eee;
	text-decoration: none; 	
	text-align: left;
	color: red;
	cursor: pointer;
}
div#navigation ul li:active {
	padding: 2px 1px 2px 10px;
	border: 1px dashed silver;
	background-color: #fff;
	color: silver; 
	text-align: left;
}
div#navigation ul li:focus {
	padding: 2px 1px 2px 10px;
	border: 1px dashed silver;
	background-color: #fff;
	color: #999999; 
	text-align: left;
}
div#navigation ul li a {
	text-decoration: none;
	text-align: left;
}
div#navigation ul li a:active {
	background-color: #eee;
	color: silver; 
	text-align: left;
}
div#navigation ul li a:hover {
	background-color: #eee;
	text-align: left;
}
div#navigation ul li a:focus {
	background-color:#fff;
	text-align: left;
}
div#navigation ul li a:visited {
	text-align: left;
}
div#navigation ul#themes {
	width:169px;
}
div#navigation ul#themes li {
	width:157px;
}
div#navigation ul#themes li:active {
	background-color: #eee;
}
div#navigation ul#pop {
	width:157px;
}
div#navigation ul#pop li {
	color: #eee;
	width:145px;
}
div#navigation ul#pop li:hover  {
	background-color: #fff;
}
div#navigation ul#pop li:active {
	background-color: #fff;
}
div#navigation ul#pop li a:hover {
	background-color: #fff;
	text-align: left;
}
div#navigation ul#pop li a:active {
	background-color: #fff;
}

div#navigation #printbutton {
	text-align: center;
    min-height: 1em;
	font-size: 0.8em;
	margin-top: 50px;
}
@media print {
  /* ... Formatdefinitionen zum Drucken - Button unsichtbar ... */
div#navigation #printbutton {
	display:none;
}
}


/*Navigation Functions for longer texts*/

table#content td#navigation {
    /*zusaetzlicher Abstandhalter zum Logo*/
	/*top: 84px; wird dank td logoclear nicht mehr benoetigt*/
	/*position: relative;*/
	background: url("../layout/mainsettings_bw.gif") top left repeat-y #666666;
	width: 178px;
	vertical-align: top;
}
table#content td#navigation #datum {
	text-align: center;
	font-size: 0.8em;
	color: gray;
	filter:DropShadow(color=#C0C0C0, offx=1px, offy=1px);
	width:171px;
}
table#content td#navigation #fontsize {
	text-align: center;
	margin-top:10px;
	color: gray;
	width:171px;
}
table#content td#navigation  ul {
	/*background: #dedaec;*/
	padding-left: 1px;
	list-style-type:square;/*list-style: none;*/
	font-size: 0.8em;
}
table#content td#navigation  ul li {
	padding: 3px 2px 3px 10px;
	font-weight: bold; 
	text-decoration: none; 	
	text-align: left;
	color: white;
}
table#content td#navigation  ul li:hover  {
	background-color: #666666;
	text-decoration: none; 	
	text-align: left;
	color: red;
	cursor: pointer;
}
table#content td#navigation  ul li:active {
	padding: 2px 1px 2px 10px;
	border: 1px dashed silver;
	background-color: #fff;
	color: silver; 
	text-align: left;
}
table#content td#navigation  ul li:focus {
	padding: 2px 1px 2px 10px;
	border: 1px dashed silver;
	background-color: #fff;
	color: #999999; 
	text-align: left;
}
table#content td#navigation  ul li a {
	text-decoration: none;
	text-align: left;
}
table#content td#navigation  ul li a:active {
	background-color: #666666;
	color: silver; 
	text-align: left;
}
table#content td#navigation  ul li a:hover {
	background-color: #666666;
	text-align: left;
}
table#content td#navigation  ul li a:focus {
	background-color:#fff;
	text-align: left;
}
table#content td#navigation  ul li a:visited {
	text-align: left;
}
table#content td#navigation  ul#themes {
	width:169px;
}
table#content td#navigation  ul#themes li {
	width:157px;
}
table#content td#navigation  ul#themes li:active {
	background-color: #666666;
}
table#content td#navigation  ul#themes li ul {
	width:157px;
}
table#content td#navigation  ul#themes li ul li {
	color: #666666;
	width:145px;
}
table#content td#navigation  ul#themes li ul li:hover  {
	background-color: #efebfd;
}
table#content td#navigation  ul#themes li ul li:active {
	background-color: #fff;
}
table#content td#navigation  ul#themes li ul li a:hover {
	background-color: #efebfd;
	text-align: left;
}
table#content td#navigation  ul#themes li ul li a:active {
	background-color: #fff;
}
table#content td#navigation #printbutton {
	text-align: center;
	font-size: 0.8em;
	margin-top: 50px;
}
@media print {
  /* ... Formatdefinitionen zum Drucken - Button unsichtbar ... */
table#content td#navigation #printbutton {
	display:none;
}
}


/* Proceedings for short and long texts */

td#verlaufproaktiv {
    background: no-repeat top right/38px url("../layout/verlaufproaktiv.svg");
    background-color: #4e4b65;
    font-size: 11px;
    color: white;
}
td#verlaufaktiv {
    background: no-repeat top right/38px url("../layout/verlaufaktiv.svg");
    background-color: #9d85d6;
    font-size: 11px;
    color: white;
}
td#verlaufpassiv {
    background: no-repeat top right/38px url("../layout/verlaufpassiv.svg");
    background-color: #4e4b65;
    font-size: 11px;
    color: white;
}
td#verlaufsendepassiv {
    background: no-repeat top right/38px url("../layout/verlaufsendepassiv.svg");
    background-color: #4e4b65;
    font-size: 11px;
    color: white;
}
td#verlaufsendeaktiv {
    background: no-repeat top right/38px url("../layout/verlaufsendeaktiv.svg");
    background-color: #9d85d6;
    font-size: 11px;
    color: white;
}

/* Recommend Functions for short and long texts */

/* not needed */

/*Bottom Line for shorter text-barrier free*/

div#bottom {
	display:none;
}