/*
	Schildgenerator 2025
	Stylesheet 2025 (CSS)
	-------  CSS  ------
*/

/* @group CSS Reset Definitions */

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, a, em, font, img, small, strong, b, u, i, center, dl, dt, dd, ol, ul, li, form, button, label, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    background: transparent;
}

body {
    line-height: 1;
}

ol, ul {
    list-style: none;
}

/* @end */

/* -- UI Color Definitionen - Aufruf Beispiel: color: var(--color-blue-01) -- */

:root {
    --color-white-00: #ffffff; /* white 00*/
    --color-white-01: #fbfbfb; /* white 01*/
    --color-blue-00: #193756; /*  blau sehr dunkel  */
    --color-blue-01: #686B75; /*  blaugrau dunkleres  */
    --color-blue-02: #747CA0; /*  blaugrau dunkel  */
    --color-blue-03: #4b8caf; /*  blau Link  */
    --color-blue-04: #8ebbd2; /*  blau Link Hover  */
    --color-blue-05: #cdd7e5; /*  blau blasser  */
    --color-blue-06: #e7ecf2; /*  blau blasser  */
    --color-blue-07: #f4f7fa; /*  blau sehr blass  */
    --color-grey-04: #3d3d3d; /*  grau  */
    --color-grey-05: #6d6d6d; /*  grau  */
    --color-green-00: #88961a; /*  green  */
    --color-green-01: #c4cc7a; /*  green light */
    --color-red-00: #9a1740; /*  red dark */
    --color-red-01: #B57974; /*  red dark light */
    --color-red-02: #F56C5F; /*  red  */
    --color-red-03: #fbada6; /*  red light */
    --color-orange-00: #eb9715; /*  orange  */
    --color-orange-01: #F5CF5F; /*  orange light  */
}

/* -- UI Color Definitionen - END -- */


small {
    font-size: 90%;
}

p.centered {
    /* text-align: center; */
}

/* ----- Site Definitions ----- */

* {
    box-sizing: border-box;
}

body {
    font: normal normal 14px/1.5 Arial, Helvetica, sans-serif;
    background-color: var(--color-blue-05);
    color: var(--color-blue-00);
}

body.unbordered {
    border-top-width: 0;
    background-color: var(--color-blue-05);
}

/* -- Oberer roter Rand fuer das Entwicklungssytem __ */
body.installation-dev {
    border-top: 5px solid var(--color-red-02);
}

body.installation-live {
}

/* Basis-Linkfarbe blau */
a,
a:visited,
a:active {
    color: var(--color-blue-03);
}

a:hover {
    color: var(--color-blue-04);
}


/* Startseite Definitionen */

.login, .logout {
    width: 460px;
    margin: 200px auto 0;
}

.login h1, #about h1, .logout h1, #svupdate h1, .logo.frame h1 {
    text-align: center;
    visibility: hidden;
    display: none
}

.login h2, #about h2, .logout h2, #svupdate h2, .logo.frame h2 {
    width: 172px;
    height: 71px;
    background: url(../images/sgx_logo_frame.jpg) no-repeat 0 0;
    text-indent: -9999px;
    position: relative;
    margin: 25px auto;
    display: block;
}

form[name="form-pre-g4-edit"] {
    /* margin: 20px 10px 10px 10px; */
}

div.hintergrundbild {
    position: absolute;
    left: 0;
    top: 50px;
    width: 800px;
    height: 800px;
    background: url(../images/puc_hh.png) no-repeat 0 0;
    z-index: -99;
}

/* Hotline-Frame - geändert FP 24.06.11 */
.hotlines_container {
    width: 460px;
    margin: 25px auto 0;
    padding: 10px;
    border-color: var(--color-red-00) !Important;
    text-align: center;
}

.hotlines_container h3 {
    color: var(--color-red-01);
    text-transform: uppercase;
    border-bottom: 1px dotted var(--color-red-01);
}

.hotlines_telefon {
    font-size: 1.667em;
    margin: 0 0 5px;
}


/* Die Neues-Seite mit den zu bestätigenden News */

body.body-neues center {
    color: var(--color-red-00);
    margin-bottom: 15px;
}

body.body-neues div.neues {
    /* width: 80%; */
    width: 900px;
    margin: 150px auto 0;
    text-align: center;
    min-height: 590px;
}

.contain .logo.frame {
	width: 460px;
}

/* Allgemeiner Container un Textblöcke zu formatieren */
.text {
	width: 430px;
    margin: 0 15px;
	text-align: center;
}

body.body-neues div.neues-newscontainer {
    max-height: 400px;
    overflow: auto;
    margin: 10px 40px 20px 40px;
}

body.body-neues table.tabelle {
    width: 100%;
}

body.body-neues div.neues-newscontainer table.tabelle tr th:first-child,
.sgxfull #main table.tabelle tr th:first-child {
    width: 33%;
}

/* Tabelle mit neuen, unbestätigten News */
.news-neu {
	
}

/* Tabelle mit alten News */
.news-alt {
    opacity: 0.7;
}

/* Sticky News - Style */

.tabelle .news-sticky {
    background-color: #fdbf7c73;
}

.attention {
    color: var(--color-red-00);
    font-size: 16px;
    font-style: italic;
    padding-bottom: 5px;
    text-align: center;
}

.important {
    color: var(--color-red-00);
    font-weight: bold;
}

.important_bad {
    color: var(--color-red-03);
    font-weight: bold;
}

.important_good {
    color: var(--color-green-00);
    font-weight: bold;
}

tr.error,
td.error {
    color: var(--color-red-03);
}

a.loeschen {
    color: var(--color-red-00);
    font-weight: bold;
}

.about {
    width: 480px;
    margin: 150px auto 0;
    padding: 0 10px;
}

.twofour {
    width: 240px;
    float: right;
    padding: 10px;
    margin-left: 40px;
}

.frame {
    border: 1px solid var(--color-blue-01);
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    background-color: var(--color-blue-07);
}

.frame-menu #top {
    padding-left: 5px;
}

.frame-menu h3 {
    font-size: 1.8em;
    font-weight: 500;
}

#menu {
    width: 200px;
    margin: 20px 15px;
}

/** habe ich mal zusammengefasst **/
/* 2025-01-08: von 'width' auf 'min-width' umgestellt */

#main, #main_broad {
    /* min-width: 980px; */
    max-width: 1400px;
    min-height: 400px;
    padding: 0 10px;
    margin: 20px 15px;
}

#upper, #under {
    min-width: 980px;
    min-height: 200px;
    margin: 10px 0 20px 8px;
    padding: 10px;
}

#under .container,
#main .container {
    float: left;
    text-align: center;
}

.service {
    margin-bottom: 1em;
}

select {
    width: 100%;
}

select.select_small {
    width: 100px;
}

table.fontstable select,
table.headstable select {
    width: 100%;
    font-size: 80%;
}

table.fontstable td,
table.headstable td {
    font-size: 90%;
    text-align: left;
}

.container {
    background-color: var(--color-blue-07);
    text-align: left;
    position: relative;
    padding: 10px;
    margin: 0 15px 15px 0;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    overflow: hidden;
}

/* Thumbnail in der Liste. Mindestgroesse fuer Zugriff falls Thumbnail fehlt. */
.container img {
    min-width: 10px;
    min-height: 10px;
    border: 1px solid var(--color-blue-05);
}

.container .conttext {
    font-size: 11px;
    margin-bottom: 7px;
    margin-top: 3px;
}

.contain {
    /* text-align: center; */
}

#upper .contain {
    text-align: left;
}

#fillform-info img {
    border: 1px solid var(--color-blue-05);
}

div.schilddetails {
    text-align: center;
}

.contend {
    width: 860px;
    margin: 10px auto 10px 0;
    clear: both;
}

/*** Anpassung für die neue Suche ***/
body.sgxfull .contend {
	/* margin: 0 auto 20px 0; */
	text-align: center;
}
.contbut {
    text-align: center;
}

#fillform-details p img {
    border: 1px solid var(--color-blue-02);

}

/*** - Tabelle formatieren - 250109 mal ganz anders - ***/

table, #main_broad .tabelle {
    min-width: 860px;
    /* max-width: 860px; */
}

table .skaleinfos {
    min-width: 200px;
}
.neues-newscontainer table {
    min-width: 800px;
}

table {
    border-collapse: separate;
    background-color: var(--color-white-01);
    border-radius: 6px;
    border-spacing: 0;
    margin: 10px auto 20px 0;
}

tbody tr th {
    font-weight: 600;
    color: var(--color-white-01);
    text-align: left;
    padding: 5px 10px;
    background-color: var(--color-blue-00);
}

tbody tr:first-child th {
    border-top: 1px solid var(--color-blue-00);

    &:first-child {
        border-top-left-radius: 6px;
    }

    &:last-child {
        border-top-right-radius: 6px;
    }
}

tbody tr td {
    color: var(--color-blue-00);
    padding: 5px 10px;
    border-bottom: 1px solid var(--color-blue-05);
}

tbody tr:nth-child(2n) {
    background-color: var(--color-blue-07);
}

tbody tr:last-child td {
    border-bottom: 1px solid var(--color-blue-05);

    &:first-child {
        border-bottom-left-radius: 6px;
    }

    &:last-child {
        border-bottom-right-radius: 6px;
    }
}

/* Kategorie Tabelle am Angang */
.auswahl tbody tr td:first-child {
    padding-left: 0;
}

/* Tabelle Anpassungen 250109 - damit der Inhalt wieder Links-bündig ist */
.table-news,
.contain table {
    text-align: left;
}

/* Tabellenformatierung fuer die Text-Tabelle (ohne Rahmen) */

.tabelletext {
    border-collapse: collapse;
    width: 90%;
    margin: 10px auto 20px;
}

.tabelletext tr {
    text-align: left;
}

.tabelletext tr td {
    vertical-align: top;
    padding: 3px 5px;
}


/* Tabellenformatierung fuer die Auswahl-Tabelle */

.auswahl {
    border-style: none;
    margin: 0 auto 0 0;
    background: none;
}

.auswahl tr {
    text-align: left;
}

/* Text Definitions */

h1, h2, h3, h4, h5 {
    font-weight: normal;
    font-style: normal;
    color: var(--color-blue-01);
}

h3 {
    font-size: 2.1em;
}

h4 {
    font-size: 1.335em;
    margin-bottom: 5px;
    margin-top: 15px;
}

h5 {
    font-size: 1.125em;
}

p {
    margin-bottom: 10px;
    margin-top: 10px;
}

.light {
    color: var(--color-blue-02);
    font-weight: normal;
    font-size: 11px;
}

.rev {
    font-style: italic;
}

.rot {
    color: var(--color-red-00);
}

a {
    text-decoration: none;
}

hr {
    clear: both;
    float: none;
}

.center {
    text-align: center;
}

.left {
    float: left;
}

.right {
    float: right;
}

select#p_breite {
    width: 80px;
    margin: 1px 0 10px 5px;
}

/* Menu Definitionen */

.lang form {
    text-align: center;
    padding: 5px 0;
}

.lang form button {
    width: 24px;
    height: 24px;
    margin: 0 5px;
}

.lang form button.but_de {
    border-style: none;
    text-indent: -9999px;
    background-image: url(../images/flags/de.png);
    background-repeat: no-repeat;
}

.lang form button.but_de:hover {
    background-image: url(../images/flags/de_o.png);
}

.lang form button.but_uk {
    border-style: none;
    text-indent: -9999px;
    background-image: url(../images/flags/uk.png);
    background-repeat: no-repeat;
}

.lang form button.but_uk:hover {
    background-image: url(../images/flags/uk_o.png);
}

.lang form button.but_pl {
    border-style: none;
    text-indent: -9999px;
    background-image: url(../images/flags/pl.png);
    background-repeat: no-repeat;
}

.lang form button.but_pl:hover {
    background-image: url(../images/flags/pl_o.png);
}

#menu h5 {
    padding: 2px 5px 0;
    background-color: var(--color-blue-00);
    color: var(--color-white-01);
    font-size: 14px;
    border: 1px solid var(--color-blue-00);
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}

#menu ul.menu2 h5,
#menu .menu-adminbereich1 h5,
#menu .menu-adminbereich2 h5,
#menu .menu-adminbereich3 h5 {
    background-color: var(--color-blue-02);
}

#menu ul.menu3 h5 {
    background-color: var(--color-blue-02);
}

#menu ul {
    width: 100%;
    border-right: 1px solid var(--color-blue-00);
    border-left: 1px solid var(--color-blue-00);
    border-bottom: 1px solid var(--color-blue-00);

    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    margin-bottom: 1.5em;
}

#menu ul li {
    list-style-type: none;
    background-color: var(--color-white-01);
}

#menu ul li.newsearch {
    background-color: var(--color-white-01);
    background-image: -webkit-linear-gradient(left, var(--color-white-01), var(--color-orange-00));
    background-image: -moz-linear-gradient(left, var(--color-white-01), var(--color-orange-00));
    background-image: -o-linear-gradient(left, var(--color-white-01), var(--color-orange-00));
    background-image: -ms-linear-gradient(left, var(--color-white-01), var(--color-orange-00));
    background-image: linear-gradient(left, var(--color-white-01), var(--color-orange-00));
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1, StartColorStr='#fbfbfb', EndColorStr='#ff923a');
}

#menu ul.menu0 {
    border-top: 1px solid var(--color-blue-01);
}

#menu .menu2, #menu .menu2 li {
    border-color: var(--color-blue-02);
}

#menu ul.menu0 li {
    border-color: var(--color-red-01);
    background-color: var(--color-red-01);
}

#menu ul li a {
    display: block;
    text-decoration: none;
    padding: 4px 0 4px 6px;
    color: var(--color-blue-00);
}

#menu ul li a:hover {
    color: var(--color-white-01);
    background-color: var(--color-blue-05);
}

#menu ul.menu0 li a {
    color: var(--color-white-01)
}

#menu ul.menu0 li a:hover {
    background-color: var(--color-red-02);
}

#menu li.buthot a {
    background-color: var(--color-red-03);
    /* color: var(--color-red-00); */
    /* border-top: 1px solid #54708d; */
    /* font-size: 13px; */
    font-weight: bold;
}

#menu li.buthot a:hover {
    background-color: var(--color-red-02);
    color: var(--color-white-01);
}

#menu li.butfail a {
    background-color: var(--color-orange-01);
    /* font-size: 13px; */
    font-weight: bold;
}

#menu li.butfail a:hover {
    color: var(--color-white-01);
    background-color: var(--color-orange-00);
}

#menu a:active {
    color: var(--color-blue-00);
    background-color: var(--color-blue-05);
}

/** Das zuletzt angeklickte Menue links */
#menu ul li.menu-link-active {
    color: var(--color-blue-00);
    background-color: var(--color-blue-05);
}

/* Formular Layout */

fieldset {
    border: none;
}

label {
    margin-right: 10px;
}

#form-plate-4g td,
#form-plate-general td {
    padding: 3px;
}

table.table-plate-4g-edit table {
    min-width: unset;
    width: auto;
}

input, input[type=submit], input[type=reset], input[type=button],
select, /*	neu 2021-04-13 */
textarea /*	neu 2021-04-13 */
{
    border: 1px solid;
    padding: 0.281em 1em;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    margin-bottom: .5em;
    position: relative;
    cursor: pointer;
}

input[type="checkbox"] {
    vertical-align: sub;
}

div #fillform-footer-container input[type="submit"],
div #fillform-footer-container a {
    min-width: 155px;
}

div #fillform-footer-container input[type="submit"] {
    /* padding: .5em 1em; */
}

table.fillform_table input,
table.fillform_table select {
    margin-bottom: 0;
}

/* einzelne Formatierung - drei Spalten Kategorien */
.auswahl select {
    border-radius: 0;
    padding: 3px;
}

input:-webkit-input-placeholder {
    color: var(--color-blue-04);
}

input:-moz-placeholder {
    color: var(--color-blue-04);
}

input:focus {
    background-color: #fff;
}

.login input {
    width: 170px;
    display: block;
    margin: 0 auto 10px;
}

.login label {
    text-indent: -9999px;
    visibility: hidden;
    display: none
}

input[type=submit], input[type=button] {
    border-color: var(--color-blue-01);
	color: var(--color-white-01);
    background-color: var(--color-blue-00);
}

input[type=submit]:hover, input[type=button]:hover {
    color: var(--color-blue-01);
    background-color: var(--color-blue-06);
}

input.but_call {
    /* margin: 5px; */
}

input[type=reset], input.red, input.box.red, input.preisgl {
    color: var(--color-white-01);
    background-color: var(--color-red-00);
    border-color: var(--color-red-00);
}

input[type=reset]:hover, input.red:hover, input.box.red:hover, input.preisgl:hover {
    color: var(--color-white-01);
    background-color: var(--color-red-01);
}

input.green, input.but_call {
    border-color: var(--color-green-00);
    background-color: var(--color-green-00);
}

input.green:hover, input.but_call:hover {
    background-color: var(--color-green-01);
}

input[type=radio], input.input_checkbox, input.input_radiobutton {
    height: 13px;
    width: 13px;
    color: var(--color-blue-01);
}

input[type=file] {
    cursor: pointer;
    padding: 2px;
}

input.field-tiny {
    width: 30px;
}

textarea {
    margin: 0 0 10px 0;
    background-color: var(--color-white-01);
    color: var(--color-blue-01);
    padding: 5px 3px;
}

p.small {
    margin-top: 0;
    font-size: 12px;
    text-align: center;
}

/* @end */

/*  Button Style  */

a.button, a.but_call, a.but_del, a.button_feedback {
	border: 1px solid;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    text-decoration: none;
    font-size: 95%;
    white-space: nowrap;
    padding: .115em 1em;
    margin-bottom: .5em;
	position: relative;
    display: inline-block;
}

a.button {
    background-color: var(--color-blue-00);
    border-color: var(--color-blue-01);
    color: var(--color-white-01);
}

a.button:hover {
    background-color: var(--color-blue-06);
    color: var(--color-blue-00);
}

a.but_call {
    border-color: var(--color-green-00);
    background-color: var(--color-green-00);
    color: var(--color-white-01);
}

a.but_call:hover {
    background-color: var(--color-green-01);
}

a.but_del {
    border-color: var(--color-red-00);
    background-color: var(--color-red-00);
    color: var(--color-white-01);
}

a.but_del:hover {
    background-color: var(--color-red-01);
}

a.button_feedback {
    border-color: var(--color-orange-00);
    background-color: var(--color-orange-00);
    color: var(--color-white-01);
}

a.button_feedback:hover {
    background-color: var(--color-orange-01);
}

/* Auswahl */

.werte {
    /* text-align: center; */
    margin-bottom: 1em;
    white-space: nowrap;
}

.werte a {
    border: 1px solid;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
	border-color: var(--color-blue-00);
    color: var(--color-blue-00);
    text-decoration: none;
    padding: 3px 6px;
    margin-bottom: .5em;
}

.werte a:hover {
    color: var(--color-blue-01);
    background-color: var(--color-blue-06);
}

.werte a.active {
    color: var(--color-white-01);
    background-color: var(--color-blue-00);
}

/* Buttons als Icons */

a.ico {
    width: 16px;
    height: 16px;
    text-indent: -9999px;
    display: block;
    float: left;
    margin-right: 5px;
}

a.ico.view {
    background: url(../images/ico_view.png) no-repeat;
}

a.ico.view:hover {
    background: url(../images/ico_view_o.png) no-repeat;
}

a.ico.new {
    background: url(../images/ico_new.png) no-repeat;
}

a.ico.new:hover {
    background: url(../images/ico_new_o.png) no-repeat;
}

a.ico.edit {
    background: url(../images/ico_edit.png) no-repeat;
}

a.ico.edit:hover {
    background: url(../images/ico_edit_o.png) no-repeat;
}

a.ico.del {
    background: url(../images/ico_del.png) no-repeat;
}

a.ico.del:hover {
    background: url(../images/ico_del_o.png) no-repeat;
}

/* Pagination */

a.pagi {
    width: 16px;
    height: 16px;
    display: inline-block;
    text-indent: -9999px;
    margin-right: 5px;
    margin-left: 5px;
}

a.pagi.first {
    background: url(../images/ico_first.png) no-repeat;
}

a.pagi.first:hover {
    background: url(../images/ico_first_o.png) no-repeat;
}

a.pagi.back {
    background: url(../images/ico_back.png) no-repeat;
}

a.pagi.back:hover {
    background: url(../images/ico_back_o.png) no-repeat;
}

a.pagi.next {
    background: url(../images/ico_next.png) no-repeat;
}

a.pagi.next:hover {
    background: url(../images/ico_next_o.png) no-repeat;
}

a.pagi.last {
    background: url(../images/ico_last.png) no-repeat;
}

a.pagi.last:hover {
    background: url(../images/ico_last_o.png) no-repeat;
}

/* IE6 Hack - weil inline-block nicht läuft */
* html a.pagi {
    text-indent: 0;
    background-image: none;
    color: var(--color-blue-01);
}

/* IE7 Hack - weil inline-block nicht läuft */
* + html a.pagi {
    text-indent: 0;
    background-image: none;
    color: var(--color-blue-01);
}

/* IE6 Hack - weil inline-block nicht läuft */
* html a.pagi.first:hover {
    color: var(--color-blue-05);
}

/* IE7 Hack - weil inline-block nicht läuft */
* + html a.pagi.first:hover {
    color: var(--color-blue-05);
}

button.button-unselect {
    font-weight: 600;
    line-height: 1em;
    /* top: 2px; */
    padding: 3px 5px;
	margin: 0;
    border: 1px solid;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-color: var(--color-red-01);
}

button.button-unselect {
    color: var(--color-white-01);
    background-color: var(--color-red-02);
}

button.button-unselect:hover {
    background-color: var(--color-red-03);
}

/* Auswahl eines Schildes. Erzeugung und Bearbeitung */
select.kategorie1,
select.kategorie2,
select.kategorie3 {
    min-width: 260px;
    width: 100%;
    height: 100px;
}

/* Hauptdiv der Schilder-Fillforms. Enthält links das Formular (#fillform-schildfelder) und rechts die Details
   (#fillform-info) */
#fillform-container {
    float: right;
    width: 160px;
}

/* Div rechts mit Vorschau-Bild, Bemerkungen etc. */
#fillform-info {
    float: right;
    width: 190px;
    text-align: center;
}

/* div links mit den Formular-Feldern. Rechts davon ist #fillform-info */
#fillform-schildfelder {
    /*	float: left; FALSCH. Wir floaten das rechte Element und dieses hier nimmt den Rest*/
    /* min-width: 700px; */
    display: inline-block;
}

div.fillform-artikel {
    width: 600px;
}

/* Die Tabelle mit den Elementen des Formulars */
.fillform_table {
    width: 100%;
}

.fillform_table td,
.fillform_table th {
    /* padding: 3px; */
    /* vertical-align: top; */
}

/* Fusszeile unter dem Fillform mit mit Sammler, Submit etc. */
#fillform-footer-container {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid var(--color-blue-02);
}

#fillform-footer-container div.block {
    float: left;
    width: 20%;
    max-width: 200px;
    margin-right: 15px;
    overflow: hidden;
}

#fillform-footer-container div.block-broad {
    width: 30%;
    min-width: 400px;
}

select.fillform_select_logo {
    /* width: 240px; */
    height: 80px;
}

div.fillform_preview_logo {
    /* margin-left: 10px; */
    width: 202px;
    height: 82px;
    background-color: var(--color-blue-06);
    text-align: center;
}

div.fillform_preview_logo img {
    max-width: 200px;
    max-height: 80px;
}

select.fillform_select_asset {
    width: 240px;
    height: 80px;
}

div.fillform_preview_asset {
    margin-left: 10px;
    width: auto;
    min-width: 200px;
    height: 80px;
    background-color: var(--color-blue-06);
    text-align: center;
}

div.fillform_preview_asset img {
    max-width: 200px;
    max-height: 80px;
}

select.fillform_select_price {
    width: 180px;
    height: 80px;
}

select.fillform_select_beilage {
    width: 240px;
    height: 300px;
}

div.fillform_preview_beilage {
    margin-left: 10px;
    width: 200px;
    height: 300px;
    background-color: var(--color-blue-06);
    text-align: center;
}

select.fillform_select_tbs {
    width: 240px;
    height: 80px;
}

div.fillform_preview_tbs {
    margin-left: 10px;
    width: 200px;
    height: 80px;
    background-color: var(--color-white-00);
    font-size: 120%;
    color: var(--color-blue-00);
    text-align: center;
}

/* ein optischer Block im Fillform */
div.fillform_sektion {
    margin: 10px 0 0 0;
    /* max-width:600px; */
}

/* Kategorie-Pflege der Bilderrahmen */

table.bilderrahmen_edit {
    width: 100%;
}

table.bilderrahmen_edit td,
table.bilderrahmen_edit th {
    padding: 3px;
    text-align: center;
    vertical-align: top;
}

input.bilderrahmen_edit_name1 {
    width: 70px;
    font-size: 90%;
}

input.bilderrahmen_edit_name2 {
    width: 80px;
    font-size: 90%;
}

input.bilderrahmen_edit_size {
    width: 40px;
    font-size: 90%;
}


table.table_settings td,
table.table_settings th {
    vertical-align: top;
    text-align: left;
}

table.table_settings select {
    width: 400px;
}

/* Angaben für Ausdruckseiten (derzeit nur Logoliste) */

body.body_forprinting {
    background-color: var(--color-white-00);
    background-image: none;
    border: 0;
    margin: 5px;
    padding: 0;
}

body.body_forprinting #main {
    background-color: transparent;
    border: none;
}

body.body_forprinting #main div.contain {
    background-color: transparent;
}

body.body_forprinting #main div.contain div.container {
    background-color: transparent;
}

body.body_forprinting #main h5 {
    text-align: left;
    padding-left: 10px;
    background-color: var(--color-blue-06);
}

/* Die neue Schild-Bearbeiten-Liste */
table.plateseditlist {
    width: 940px;
    table-layout: fixed;
}

table.plateseditlist th,
table.plateseditlist td {
    font-size: 11px;
    text-align: center;
}

/* Die Tabelle mit den Infos zu den Skalierungsfaktoren beim Schild-Edit */
table.skaleinfos {
    margin: 10px 0 0 18px;
}

table.skaleinfos td {
    text-align: left;
}

/* Pflege einer Preisliste */
table.preisliste_edit {
}

table.preisliste_edit input {
    width: 90px;
    text-align: right;
}


/* Bei den Textbausteinen zu Hervorhebung der Zeilen mit den echten texten */
tr.texbausteine_texte {
    color: var(--color-blue-00);
}

tr.texbausteine_texte td {
    font-size: 11px;
}

table.tabelle td.texbausteine_texte {
    /* background-color: #f8f8ff; */
}

tr.texbausteine_trennzeile td {
    background-color: #8EC1E5;
}

/* Markiert in der Liste der Schildgenerierung und Bearbeitung Schilder mit Textbaustein (4G) */
div.schild_mittbs,
tr.schild_mittbs td,
tr.schild_mittbs a,
td.schild_mittbs,
td.schild_mittbs a {
    /*
        Jetzt unten als schildauswahl_ribbon gelöst
        background-color: #ffaa88 !important;
        color: #000000 !important;
    */
}

/* Markiert getaggte TBS-Schilder zu denen kein TBS vorhanden ist. Werden fuer Endbenutzer unterdrueckt - nur Admin */
div.schild_mittbsleer,
tr.schild_mittbsleer td,
tr.schild_mittbsleer a,
td.schild_mittbsleer,
td.schild_mittbsleer a {
    background-color: var(--color-red-00) !important;
    color: var(--color-blue-00) !important;
}

/* Markiert getaggte TBS-Schilder zu denen kein Logo vorhanden ist. Werden fuer Endbenutzer unterdrueckt - nur Admin */
div.schild_mitlogoleer,
tr.schild_mitlogoleer td,
tr.schild_mitlogoleer a {
    background-color: var(--color-red-01) !important;
    color: var(--color-blue-00) !important;
}

p.reminder {
    width: 60%;
    background-color: var(--color-red-02);
    color: var(--color-white-01);
    padding: 10px;
    margin: 0 auto;
    border: 1px solid var(--color-red-00);
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}

/* Container des Vorschau-Bild bei der Schildauswahl vom Generieren */
div.schildauswahl_container {
    /* position: relative; */ /* Fuer Ausrichtung des Ribbons */
}

/* Das Ribbon fuer TBS-Schilder in der Generieren-Anzeige */
div.schild_mittbs a.schildauswahl_ribbon,
div.schild_mittbsleer a.schildauswahl_ribbon {
    position: absolute;
    left: 11px;
    top: 11px;
    width: 70px;
    height: 50px;
    background-color: transparent !important;
    background-image: url(../images/ribbon_variabel_70x50.png);
}

/* Das Ribbon fuer Schilder mit getaggten Logos */
div.schild_mitlogotagged a.schildauswahl_ribbon {
    position: absolute;
    left: 11px;
    top: 11px;
    width: 70px;
    height: 50px;
    background-color: transparent !important;
    background-image: url(../images/ribbon_tags_70x50.png);
}

/* Container des Vorschau-Bild bei der Schildauswahl vom Bearbeiten */
td.schildauswahl_container {
    position: relative; /* Fuer Ausrichtung des Ribbons. Ups: Boders der Zellen verschwinden - wieso? */
}

/* Das Ribbon fuer TBS-Schilder in der Bearbeiten-Anzeige */
td.schild_mittbs a.schildauswahl_ribbon,
td.schild_mittbsleer a.schildauswahl_ribbon {
    position: absolute;
    left: 18px;
    top: 4px;
    width: 70px;
    height: 50px;
    background-color: transparent !important;
    background-image: url(../images/ribbon_variabel_70x50.png);
}

td.schild_mitlogotagged a.schildauswahl_ribbon {
    position: absolute;
    left: 18px;
    top: 4px;
    width: 70px;
    height: 50px;
    background-color: transparent !important;
    background-image: url(../images/ribbon_variabel_70x50.png);
}

/* Container zur absoluten Positionierung des Ribbons. Eingefuehrt fuer Assets und Logos */

div.ribbon_container {
    position: relative;
}

/* Ribon fuer Logos mit Tags. Absolute zu ribbon_container positioniert. */

div.asset_mit_tagsset span.schildauswahl_ribbon {
    position: absolute;
    left: 10px;
    top: 10px;
    width: 70px;
    height: 50px;
    background-color: transparent !important;
    background-image: url(../images/ribbon_tags_70x50.png);
}


/* Ribon fuer Logos mit Kategorie 2 Blacklist. Absolute zu ribbon_container positioniert. */

div.asset_mit_kat2blacklist span.schildauswahl_ribbon {
    position: absolute;
    left: 10px;
    top: 10px;
    width: 70px;
    height: 50px;
    background-color: transparent !important;
    background-image: url(../images/ribbon_restricted_70x50.png);
}


/* Ribon fuer Assets mit Kategorie 2 Blacklist. Absolute zu ribbon_container positioniert. */

div.logo_mit_tagsset span.schildauswahl_ribbon {
    position: absolute;
    left: 15px;
    top: 11px;
    width: 70px;
    height: 50px;
    background-color: transparent !important;
    background-image: url(../images/ribbon_tags_70x50.png);
}

div.logo_mit_kat2blacklist span.schildauswahl_ribbon {
    position: absolute;
    left: 15px;
    top: 11px;
    width: 70px;
    height: 50px;
    background-color: transparent !important;
    background-image: url(../images/ribbon_restricted_70x50.png);
}


div.admin_specials {
}

div.admin_specials a {
    font-weight: bold;
}

td.editform_bereich {
    text-align: left;
    color: var(--color-blue-00);
    font-weight: bold;
    letter-spacing: 1px;
    vertical-align: top;
}

select.select_250 {
    width: 250px;
}

div.plateedit-layer1 {
    position: absolute;
    left: 554px;
    top: 43px;
    width: 356px;
    height: 470px;
    z-index: 1;
}


.table_puffered td,
.table_puffered th {
    padding: 5px;
}


/* Toggable Container um um div.sammlerlaenge-container */
#generate_sammlerlaenge {
}

/* Text zur Länge im Sammler beim Erzeugen eines Schildes */
div.sammlerlaenge-container {
    padding: 10px;
    border: 1px solid var(--color-blue-01);
    background-color: var(--color-white-00);
    font-weight: bold;
    min-width: 560px;
    max-width: 800px;
    margin: 20px auto 10px 0;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
}

#generate_sammlerlaenge .nobreak {
    white-space: nowrap;
}

/* Bei der Erfassung mancher Schildaten kann der Benutzer auswählen ob er Feld X will oder Y (z.B. TBS oder Asset). */
div.radioalternative-container {
    border: solid 1px var(--color-blue-02);
    border-radius: 5px;
    padding: 10px;
    margin-top: 5px;
}

div.radioalternative-container div.fillform_sektion {
    margin-top: 5px;
    /* max-width: 600px; */
}

img.wasserzeichen-thumbnail {
    width: 90px;
}

input[name="anzahl"] {
    max-width: 70px;
}