@charset "UTF-8";
* {
color: #323232;
font-family: Verdana;
font-size: 13px;
margin: 0px;
padding: 0px;
}
body, html {
 font-size: 0.9em;
 margin: 0px;
 padding: 0px;
}
.antifloat {
 clear: both;
 visibility: hidden;
 font-size: 1px;
 height: 1px;
}
.floatLeft {
 float: left;
}
a:link, a:focus, a:visited {
 color: #323232;
 font-weight: bold;
text-decoration: underline;
}
a:active { color: #f29708; }
h1 {
 font-size: 1.1em;
 font-weight: bold;
 margin: 0px 0px 10px 0px;
}
h1, h2, h3, h4, h5, h6, p {
margin: 0px 0px 10px 0px;
padding: 0px 30px 0px 0px;
text-transform: none;
}
img {
border: none;
display: block;
}
input, button {
float: right;
width: 165px;
}
input.einstellungsbutton, button.einstellungsbutton {
position: absolute;
bottom: 21px;
right: 26px;
}
input.einstellungsvorschaubutton, button.einstellungsvorschaubutton {
position: absolute;
bottom: 21px;
right: 226px;
}
input.checkbox {
background-color: transparent !important;
border: none !important;
float: none;
vertical-align: middle;
width: auto;
}
input.inputtext {
width:308px;
float: left;
}
form.pdfl_outline input.inputtext {
width:628px;
float: left;
}
input.text {
 background-color: #F29708;
 border: 1px solid #000000;
 height: 27px;
}
label {
 float: left;
 margin: 0px 0px 0px 10px;
 width: 284px;
}
label.checkbox {
width: 276px;
}
p {
 font-size: 1em;
 font-weight: normal;
 letter-spacing: -1px;
 line-height: 1.4em;
 margin-bottom: 10px;
}
h2.farbe1 {
 margin: 0px;
 padding: 3px 7px;
}
h2.farbe1 a, h2.farbe2 a {
text-decoration: none;
}
h2.farbe1 a:hover, h2.farbe2 a:hover {
text-decoration: underline;
}
div.farbe1_antwort {
 margin: 0px;
 padding: 3px 21px 15px 21px;
 font-style: italic;
 display: none;
}
h2.farbe2 {
 background: #C0D0D3;
 margin: 0px;
 padding: 3px 7px;
}
div.farbe2_antwort {
 background: #C0D0D3;
 margin: 0px;
 padding: 3px 21px 15px 21px;
 font-style: italic;
 display: none;
}
table {
border-collapse: collapse;
display: table;
margin: 0px 0px 10px 0px;
}
td, th {
padding: 0px 6px 6px 0px;
vertical-align: top;
}
textarea {
 width: 455px;
 height: 58px;
 border: 1px solid #000000;
 background-color: #FFFFFF;
 float: right;
 padding: 4px 0px;
 font-family: Verdana;
 font-size: 0.9em;
}
ol {
display: table;
margin: 0px 0px 10px 24px;
}
ul {
display: table;
margin: 0px 0px 10px 16px;
}
#head {
background-color: #FFFFFF;
 background-repeat: no-repeat;
 border-bottom: 1px solid #969696;
 height: 75px;
 margin: 0px;
padding: 0px;
 position: relative;
 width: 100%;
}
#head .headcenter {
margin: 0px auto;
position: relative;
width: 839px;
}
#head img {
position: absolute;
top: 12px;
left: 10px;
}
#head .banner {
background-image: url(/viomatrix/imgs/center_bgr_158.jpg);
background-position: 0px -160px;
border: 1px solid #969696;
display: block;
float: right;
height: 50px;
margin: 9px 0px 0px 0px;
overflow: hidden;
padding: 3px 6px;
text-decoration: none;
width: 407px;
}
.vcard { 
position: absolute;
margin-top: -120px;
margin-left: 750px;
width: 200px;
border: 1px dashed rgb(80,80,80);
}
#wrapper {
background-image: url(/viomatrix/imgs/center_bgr_158.jpg);
background-repeat: repeat-x;
background-position: 0px 75px;
border-color: #969696;
border-style: solid;
border-width: 0px 0px 1px 0px;
margin: 0px;
padding: 0px 0px 20px 0px;
position: relative;
top: 0px;
width: auto;
z-index: 10;
}
.menu {
background: none;
border-width: 0px 1px 0px 0px;
border-style: solid;
 border-color: #969696;
clear: both;
float: none;
 height: 25px;
 margin: 0px auto;
padding: 0px;
 position: relative;
 width: 837px;
 }
/* CSS Hack für Safari und Chrome */
body:nth-of-type(1) .menu {
width: 838px;
}
.menu li {
border: none;
float: left;
list-style: none;
width: 167px;
}
.menu li.first {
width: 169px;
}
.menu li a {
 background-repeat: repeat-x;
text-transform: none;
}
.menu li a:link, .menu li a:focus, .menu li a:visited {
background: url(/viomatrix/imgs/mainmenu_bgr_390.gif);
border-left: 1px solid #969696;
border-bottom: 1px solid #969696;
color: #323232;
display: block;
float: left;
font-size: 1.2em;
font-weight: bold;
margin: 0px;
padding: 3px 0px;
text-align: center;
text-decoration: none;
 width: 166px;
}
.menu li.first a:link, .menu li.first a:focus, .menu li.first a:visited {
 width: 168px;
}
.menu li a.active:link, .menu li a.active:focus, .menu li a.active:visited {
 background: url(/viomatrix/imgs/mainmenu_bgr_active_991.gif);
 border-bottom: none;
 color: #FFFFFF;
padding: 3px 0px 4px 0px;
}
#contentholder {
background-image: url(/viomatrix/imgs/menusteps_bgr_680.gif);
background-repeat: repeat-x;
border-top: 1px solid #969696;
margin: 0px auto;
position: relative;
top: -1px;
width: auto;
}
.skyscraper_box {
margin: 0px;
position: fixed;
right: 20px;
z-index: 2;
}
.skyscraper {
background-image: url(/viomatrix/imgs/center_bgr_158.jpg);
background-position: 0px -5px;
background-repeat: repeat-x;
border: 1px solid #92979A;
margin: 15px 0px 0px 0px;
overflow: hidden;
padding: 6px;
width: 165px;
}
.skyscraper * {
padding-right: 0px;
}
#content a:before,.teaser a:before { content:""; }
#content a.external:after,.teaser a.external:after { content:""; }
#content {
background: none;
padding: 0px;
clear: both;
float: none;
margin: 0px auto;
min-height: 350px;
width: 838px;
}
* html #content { height: 350px; }
#navpath {
 background-repeat: repeat-x;
 border-bottom: 1px solid #969696;
 height: 50px;
margin: 0px;
}
#menusteps {
 display: block;
 margin: 0px auto;
 padding: 11px 0px 0px 0px;
 text-align: center;
 width: 838px;
}
#menusteps a {
background-position: 0px 0px;
background-repeat: no-repeat;
color: #969696;
font-weight: normal;
text-decoration: none;
}
#menusteps a * {
 padding: 0px 17px 0px 0px;
}
#menusteps a.todo {
background-image: url(/viomatrix/imgs/menustep_normal.png);
color: #969696;
font-weight: normal;
padding: 4px 35px 10px 9px;
}
#menusteps a.active {
background-image: url(/viomatrix/imgs/menustep_active.png);
color: #323232;
font-weight: bold;
padding: 4px 35px 10px 10px;
}
#menusteps a.passed {
background-image: url(/viomatrix/imgs/menustep_passed.png);
color: #323232;
font-weight: normal;
padding: 4px 35px 10px 10px;
}
#menusteps a.todo * {
color: #969696;
font-weight: normal;
}
#menusteps a.active * {
color: #323232;
font-weight: bold;
}
menusteps a.passed * {
color: #323232;
font-weight: normal;
}
span.haarlinie_links {
 display: block;
 width: 80px;
 height: 1px;
 background-image: url(/viomatrix/imgs/haarlinie_links.gif);
 background-repeat: no-repeat;
 position: absolute;
 top: 50px;
 left: 0px;
 z-index: 1;
}
* html span.haarlinie_links { top: 51px; }
span.haarlinie_rechts {
 display: block;
 width: 80px;
 height: 1px;
 background-image: url(/viomatrix/imgs/haarlinie_rechts.gif);
 background-repeat: no-repeat;
 position: absolute;
 top: 50px;
 right: 0px;
 z-index: 1;
}
* html span.haarlinie_rechts { top: 51px; }
#content.content_conf #text {
padding: 0px;
width: 834px;
}
#content.content_conf .editor {
background-color: #FFFFFF;
border: 2px solid #F19707;
}
#content.content_conf label.checkbox {
clear: none;
float: left;
width: 605px;
}
.text {
background: none;
 background-repeat: repeat-x;
 clear: both;
 display: block;
 float: none;
 min-height: 350px;
 margin: 0px auto;
 padding: 30px 0px 0px 0px;
 width: 838px;
}
.text #left_index {
 float: left;
 width: 300px;
 padding: 4px 30px 50px 50px;
}
.text #left_index img {
 height: 317px;
}
.text #right_index {
 float: right;
 width: 455px;
}
.text #right_index .fileupload {
clear: both;
display: block;
float: right;
height: auto;
margin: 0px;
width: auto;
}
#content form {
margin: 0px 0px 0px 0px;
}
#content input {
 background-color: #FFFFFF;
 border: 1px solid #5F5F5F;
 height: 20px;
 margin: 3px 0px;
 padding: 0px;
}
#content input.button, #content button.button {
background-color: #F29708;
background-image: url(/viomatrix/imgs/bg_button_175.png);
background-repeat: repeat-x;
border: 1px solid #000000;
cursor: pointer;
font-size: 1.0em;
font-weight: bold;
height: 27px;
margin: 13px 0px 0px 0px;
min-width: 165px;
}
#content input[disabled="disabled"], #content input[disabled="true"], #content input[disabled],
#content button[disabled="disabled"], #content button[disabled="true"], #content button[disabled],
#content input[readonly="true"], #content input[readonly="true"],
#content button[readonly="true"], #content button[readonly="true"],
#content .readonly {
background-image: none;
background-color: #FBD598;
color: #969696;
cursor: not-allowed;
}
#content #cf_submit {
margin-top: 40px;
}
#content input.checkbox {
 width: 14px;
 height: 16px;
 border: 0px none;
 float: left;
 padding: 0px;
 margin: 2px 5px 0px 0px;
}
#content input.missing, #content textarea.missing {
 background-color: #FFFFFF;
 border: 1px solid #F19707;
 color: #F19707;
 font-weight: bold;
 height: 20px;
 margin: 3px 0px;
 padding: 0px;
}
#content #left {
 float: left;
 padding: 4px 54px 10px 0px;
 width: 476px;
}
#content #right {
 float: left;
 margin: 0px;
 padding: 0px;
 width: 308px;
}
#content #right p {
margin-bottom: 10px;
}
#content .zahlungsart {
float: left;
margin: 0px 0px 10px 0px;
width: 100%;
}
#content .zahlungsart img {
float: left;
margin: 0px;
max-width: 280px;
padding: 0px;
}
#content inputerror {
 background-color: #FFFFFF;
 border: 1px solid #F19707;
 width: 210px;
 height: 20px;
 padding: 0px;
 margin: 3px 0px;
 float: left;
}
#content input.radio {
 background-color: #FFFFFF;
 border: 0px none;
 width: 14px;
 height: 14px;
}
#content input.email {
 width: 163px;
}
#content #cf_rechnungpost label {
margin: 6px 0px 0px 0px;
}
#content #cf_rechnungpost input {
float: left;
height: 20px;
margin: 3px 0px;
padding: 0px;
width: 205px;
}
#content #cf_rechnungpost #cf_plz {
 width: 45px;
 text-align: center;
}
#content #cf_rechnungpost #cf_ort {
 width: 97px;
}
#content #cf_orderrechnung {
 margin: 9px 0px;
 width: 14px;
 height: 16px;
}
#content label {
 margin: 1px 0px 0px 0px;
 padding: 0px;
 width: 100px;
}
#content label.labelemail, #content label.labelgutschein {
 margin: 6px 0px 0px 0px;
 padding: 0px;
 width: 142px;
}
#content label.labelgutschein {
width: 308px;
display: block;
}
#content #cf_rechnungpost label.ort {
 margin-left: 10px;
 margin-right: 6px;
 padding: 0px;
 text-align: right;
 width: 45px;
}
#content label.orderrechnung {
 width: 280px;
 margin: 8px 0px 10px 10px;
}
#colorpicker_input_holder {
 float: left;
 margin: 10px 0px;
}
.pdflp_agb {
margin-top: 10px;
}
.pdflp_agb p {
 display: block;
 float: left;
 padding: 0px;
 margin: 2px 0px 0px 10px;
}
.pdflp_agb input {
 width: 14px;
 height: 16px;
}
#footer {
 display: block;
height: auto;
 margin: 0px auto;
 padding: 0px;
 width: 838px;
}
#footer li {
 display: block;
  width: 168px;
 min-width: 93px;
 padding: 0px 20px;
 height: 13px;
 border-left: 1px solid #969696;
 float: right;
 text-align: center;
}
#footer li.first {
 border-left: 0px none;
}
#footer li a:link, #footer li a:focus, #footer li a:visited {
color: #323232;
font-weight: normal;
text-decoration: none;
}
#footer li.active a:link, #footer li.active a:focus, #footer li.active a:visited {
 font-weight: bold;
}
/* Step 2 */
#progressbar {
border: none;
clear: both;
display: block;
float: right;
height: 41px;
margin: 30px auto 0px auto;
overflow: hidden;
position: relative;
width: 306px;
padding: 0px;
background-position: 0px 0px;
background-repeat: no-repeat;
}
* html #progressbar { top: 50px; }
#progressbar img {
position: absolute;
}
#progressbar p {
 position: absolute;
 left: 9px;
 top: 28px;
 line-height: 1em;
 height: 13px;
 overflow: hidden;
 width: 294px;
}
/* Beispiele */
.bsp {
float: left;
width: 404px;
}
.bspleft { margin-right: 30px; }
.bsp img {
float: left;
margin: 0px 9px 0px 0px;
width: 156px;
}
.bsp .bsp_text {
float: left;
width: 239px;
margin: 0px 0px 30px 0px;
}
.bsp .bsp_text p {
margin: 0px 0px 15px 0px;
padding: 0px;
}
/* Kontakt */
.contact {
width: auto;
}
.contact * {
width: 540px;
}
.contact form {
width: auto;
}
.contact div.hint {
width: 558px;
}
.contact div.missing {
background: #F19707;
}
.contact form label {
float: left;
width: 110px;
margin: 0px;
padding: 5px 17px 0px 0px;
text-align: right;
}
#content .contact form input, #content .contact form select, #content .contact form textarea {
background-color: #FFFFFF;
border: 1px solid #000000;
clear: none;
float: left;
height: 19px;
margin: 0px 0px 21px 0px;
padding: 4px 0px 0px 0px;
width: 430px;
}
#content .contact form .missing {
border: 1px solid #F19707;
}
#content .contact form textarea {
height: 58px;
}
#content .contact form input.button, #content .contact form button.button {
background-color: #F29708;
border: 1px solid #000000;
cursor: pointer;
float: right;
font-size: 1.2em;
font-weight: bold;
height: 27px;
padding: 0px;
width: 165px;
}
.content_conf {
 background: #FFFFFF;
 display: block;
 min-height: 380px;
 margin: 0px auto 15px auto;
 width: 838px;
}
.content_conf.extraheight {
height: 500px;
}
* html .content_conf { height: 380px; }
.content_conf #left {
 float: left;
 height: 100%;
 list-style: none;
 margin: 0px 3px 0px 4px;
 padding: 0px;
 width: 163px;
}
.content_conf #left li {
list-style: none;
margin: 10px 0px 22px 0px;
}
.content_conf #left li a:link, .content_conf #left li a:visited, .content_conf #left li a:focus {
color: #323232;
display: block;
font-weight: bold;
padding: 6px 10px;
text-align: right;
text-decoration: none;
}
.content_conf #left li a:hover { text-decoration: underline; }
.content_conf #left li a.active {
background-color: #f7c16a;
}
.content_conf #right {
 border: 0 none;
 float: left;
 height: 100%;
 position: relative;
 width: 655px;
}
.content_conf #right h1 {
margin: 19px 0px 0px 14px;
padding: 0px;
letter-spacing: -1px;
}
.content_conf form {
 margin: 18px 0px 0px 15px;
 padding: 0px 30px 0px 0px;
}
#content.content_conf label {
clear: both;
display: block;
float: none;
margin: 0px 0px 7px 0px;
width: auto;
}
#content .hinweistext {
background-color: #F0F5F8;
border: 1px dashed #969696;
clear: both;
float: none;
margin: 6px 0px 0px 0px;
padding: 3px 6px;
}
#content #right .hinweistext p {
margin-bottom: 10px;
}
.testdownload {
 font-weight: normal;
 font-size: 1.1em;
 margin: 10px 0px 40px 0px;
 background-color: #F29708;
 border: 1px solid #000000;
 height: 27px;
}
#content .pdfl_config.pdfl_inline label {
clear: both;
display: block;
float: none;
margin: 0px 0px 7px 0px;
width: auto;
}
#content .pdfl_config.pdfl_inline label.checkbox {
clear: none;
float: left;
margin: 0px 0px 7px 0px;
width: 276px;
}
#einstellungen_aufl { padding: 0px; }
#einstellungen_aufl img { display: inline; }
#einstellungen_aufl td {
height: 90px;
text-align: center;
vertical-align: middle;
}
#einstellungen_aufl td.aufl_size {
padding-right: 30px;
width: 160px;
}
#einstellungen_aufl label.checkbox {
display: inline;
float: none;
margin: 0px;
width: auto;
}
#color_choose {
 float: right;
 display: block;
 width: 300px;
}
#format_sizer {
 background-image: url(/viomatrix/imgs/groessenregler.gif);
 background-repeat: no-repeat;
 float: none;
 clear: both;
 height: 13px;
 width: 156px;
 padding: 2px;
}
#format_sizerpos {
 background-image: url(/viomatrix/imgs/groessenregler_schieber.gif);
 background-position: 50px 0px;
 background-repeat: no-repeat;
 height: 13px;
 width: 152px;
}
#format_size {
 margin: 5px 0px 0px 0px;
 padding: 0px;
}
#content #cf_format_size_spacer {
 width: 42px;
 float: left;
 text-align: center;
 margin: 0px;
 padding: 0px;
}
#content .cf_format {
 border: 1px solid #5F5F5F;
 float: left;
 height: 13px;
 margin: 0px;
 padding: 0px 0px 2px 0px;
 text-align: center;
 width: 55px;
}
.marketing {
clear: both;
float: none;
text-align: center;
}
.marketing .box {
background-image: url(/viomatrix/imgs/center_bgr_158.jpg);
background-position: 0px -160px;
border: 1px solid #969696;
display: inline-block;
margin: 0.6%;
padding: 6px;
text-decoration: none;
vertical-align: top;
width: 30%;
}
span.h1 {
font-size: 1.1em;
font-weight: bold;
margin: 0px 0px 10px 0px;
}
span.h1, span.h2, span.h3, span.h4, span.h5, span.h6 {
display: block;
margin: 0px 0px 10px 0px;
padding: 0px 30px 0px 0px;
text-transform: none;
}
span.p {
display: block;
font-size: 1em;
font-weight: normal;
letter-spacing: -1px;
line-height: 1.4em;
margin-bottom: 10px;
}
span.table {
border-collapse: collapse;
display: table;
margin: 0px 0px 10px 0px;
}
span.thead {
display: block;
}
span.tbody {
display: block;
}
span.tfoot {
display: block;
}
span.tr {
display: block;
}
span.th, span.td {
display: block;
padding: 0px 6px 6px 0px;
vertical-align: top;
}
span.ol {
display: table;
margin: 0px 0px 10px 24px;
}
span.ul {
display: table;
margin: 0px 0px 10px 16px;
}
span.li {
display: block;
}
#content #right .pAsSpan p {
margin: 0px;
padding-left: 5px;
}
#content #right fieldset .errortext {
border:1px dashed red;
clear:both;
color:red;
display:none;
font-size:11px;
height:35px;
padding:5px 5px 5px 0px;
}
#content #left .hint {
background-color:rgb(251,213,152);
border:1px dashed #969696;
clear:both;
float:none;
margin:6px 0px 0px 0px;
padding:3px 6px;
}
#content #left .preview {
display:block;
background-image: url(/viomatrix/imgs/ie8_win7_926.png);
background-repeat: no-repeat;
width:476px;
height:372px;
margin:0px;
padding:0px;
}
#content #left .preview>img {
margin:0px 0px 0px 225px;
padding:65px 0px 55px 0px;
}
#content #left .click {
   cursor: pointer;
width:476px;
height:196px;
margin-top:-372px;
position:absolute;
z-index:1000;
background-color:rgb(183,202,205);
opacity:0.7;
filter:alpha(opacity=70);
text-align:center;
padding-top:176px;
background-image: url(/viomatrix/imgs/play_716.png);
background-repeat: no-repeat;
background-position:center;
}
#content #left .click:hover {
opacity:0.5;
filter:alpha(opacity=50);
}