@charset "UTF-8"; @media screen, projection, print { .webkit .form_text { margin-bottom: 16px; clear: both; display: block } .webkit .email-post-field { display: none; } .webkit .yform { background: #fff; margin: 0 -18px 0 0; } .webkit .yform fieldset { background: #fff; margin: 0 -10px 0 0; } .webkit .yform fieldset .container-fluid { clear: both; } .webkit .yform legend { font-size: 125%; font-weight: normal; color: #000; } .webkit .yform label { color: #000; } .webkit .yform input:not(.btn_function, .btn_cta), .webkit .yform textarea, .webkit .yform select, .webkit .yform optgroup { font-family: Arial, Helvetica, "Microsoft Yahei", "微软雅黑", sans-serif; /* proportional fonts for all form elements */ resize: none; border-radius: .4rem; } .webkit .yform .type-text input:not(.btn_function, .btn_cta), .webkit .yform .type-text textarea, .webkit .yform .type-select select { border: 1px solid #dedede; resize: none; } /* :hover and :focus status on form fields | Effekt zur Hervorhebung von Formularfeldern bei :hover oder :focus */ .webkit .yform div.type-text input:focus, .webkit .yform div select:focus, .webkit .yform div textarea:focus, .webkit .yform div.type-text input:hover, .webkit .yform div select:hover, .webkit .yform div textarea:hover, .webkit .yform div.type-text input:active, .webkit .yform div select:active, .webkit .yform div textarea:active {} /* Styling of custom styled buttons | Gestaltung von individuell gestalteten Buttons */ .webkit .yform .type-button input:not(.btn_function, .btn_cta) { border: 1px #fff solid; color: #fff; background: #c00 url(../../../layout_wl2/images_wl2/but_arr.gif) 5px top no-repeat; padding: 2px 4px 3px 14px; font-size: 8pt; font-weight: bold; margin-right: 4px; } .webkit .yform .type-button input[type=reset]:not(.btn_function, .btn_cta) { color: #fff; background: #c00 url(../../../layout_wl2/images_wl2/but_arr.gif) 5px top no-repeat; padding: 2px 8px 2px 18px; } /*Wrth: -- URL is being overwritten in urls.css | URL wird in urls.css ueberschrieben: ../../../layout/images/but_arr.gif*/ .webkit .yform .type-button input[type=submit]:not(.btn_function, .btn_cta) { color: #fff; background: #c00 url(../../../layout_wl2/images_wl2/but_arr.gif) 5px top no-repeat; padding: 2px 8px 2px 18px; } /*Wrth: -- URL is being overwritten in urls.css | URL wird in urls.css ueberschrieben: ../../../layout/images/but_arr.gif*/ /*in IE hacks /* optional button styling for IE6 using classes * * html .yform .type-button input.reset, * html .yform .type-button input.submit { color:#fff; background:#c00 url(../../images/but_arr.gif) 4px top no-repeat;margin-left:1px;padding:3px 6px 2px 16px;}/*Wrth: -- URL is being overwritten in urls.css | URL wird in urls.css ueberschrieben: ../../../layout/images/but_arr.gif* /* optional button styling for IE7 using classes * *+html .yform .type-button input.reset, *+html .yform .type-button input.submit { color:#fff; background:#c00 url(../../images/but_arr.gif) 4px top no-repeat;margin-left:1px;padding:3px 6px 2px 16px;}/*Wrth: -- URL is being overwritten in urls.css | URL wird in urls.css ueberschrieben: ../../../layout/images/but_arr.gif* /*IE8* .yform .type-button input.reset, .yform .type-button input.submit { background:#c00 url(../../images/but_arr.gif) 5px top no-repeat\9;/*Wrth: -- URL is being overwritten in urls.css | URL wird in urls.css ueberschrieben: ../../../layout/images/but_arr.gif* padding:3px 7px 4px 17px\9; }*/ /* :hover and :focus status on buttons | Effekt zur Hervorhebung von Schaltern bei :hover oder :focus */ .webkit .yform div.type-button input:focus:not(.btn_function, .btn_cta), .webkit .yform div.type-button input:hover:not(.btn_function, .btn_cta), .webkit .yform div.type-button input:active:not(.btn_function, .btn_cta) { border-top: 1px #fff solid; border-left: 1px #fff solid; border-right: 1px #fff solid; border-bottom: 1px #fff solid; color: #fff; background: #c00 url(../../../layout_wl2/images_wl2/but_arr.gif) 5px top no-repeat; } .webkit .yform div.type-button input.reset:focus:not(.btn_function, .btn_cta), .webkit .yform div.type-button input.reset:hover:not(.btn_function, .btn_cta), .webkit .yform div.type-button input.reset:active:not(.btn_function, .btn_cta) { background: #c00 url(../../../layout_wl2/images_wl2/but_arr.gif) 5px top no-repeat; color: #fff; } .webkit .yform div.type-button input.submit:focus:not(.btn_function, .btn_cta), .webkit .yform div.type-button input.submit:hover:not(.btn_function, .btn_cta), .webkit .yform div.type-button input.submit:active:not(.btn_function, .btn_cta) { background: #c00 url(../../../layout_wl2/images_wl2/but_arr.gif) 5px top no-repeat; color: #fff; } /*------------------------------------------------------------------------------------------------------*/ /** * Vertical-Forms - technical base (standard) * * |-------------------------------| * | fieldset | * |-------------------------------| * | label | * | input / select / textarea | * |-------------------------------| * | /fieldset | * |-------------------------------| * * (en) Styling of forms where both label and input/select/textarea are styled with display:block; * (de) Formulargestaltung, bei der sowohl label als auch input/select/textarea mit display:block; gestaltet werden * * WARNING:This part contains several IE-stability-fixes. Don't edit this part if you are not sure, what you're doing! */ /* General form styling | Allgemeine Formatierung des Formulars */ .webkit .yform { overflow: hidden; } .webkit .yform fieldset { overflow: hidden; } .webkit .yform label { display: block; cursor: pointer; margin-bottom: 5px } .webkit .yform label.type-check { display: block; cursor: pointer; float: left; padding-right: 16px } .webkit .yform legend { background: transparent; border: 0; padding: 0 0.5em; } .webkit .yform .message { display: block; margin-bottom: 16px; color: #605d5c; } /* Hiding of hidden fields (otherwise ugly spaces in Firefox) | Versteckte Felder wirklich verstecken (sonst ggf. häßliche Lücken im Firefox) */ .webkit .yform input[type=hidden] { display: none !important; } /* Highlight mandatory fields | Pflichtfeldkennzeichnung hervorheben */ .webkit .yform sup { color: #000; } /* styling containing DIV elements | Gestaltung der kapselnden DIV-Elemente */ .webkit .yform div.type-text, .webkit .yform div.type-file, .webkit .yform div.type-select, .webkit .yform div.type-button { margin: 0 0 0 0; padding: 0 20px 0 0; position: relative; overflow: hidden; clear: both; } .webkit .yform div.type-text { /*margin-bottom:16px;*/ } .webkit .yform div.type-text p, .webkit .yform div.type-file p { margin-bottom: 0; } .webkit .yform div.type-check { margin: 0 0 0 0; padding: 2px 14px 0 0; position: relative; overflow: hidden; /*float:left;*/ /*margin-bottom:16px;*/ } .webkit .yform div.type-check.form_values_row { float: left; margin-right: 10px; min-width: 40px; display: inline-block; } .webkit .yform div.form_text select, .yform div.type-select select { border: 1px solid #dedede; /*width:440px;*/ width: 100%; padding: 1px; } .webkit .yform div.type-button { padding: 3px 0em; margin: -4px 0 0 -1px; } /* styling standard form elements with 'almost' equal flexible width | Gestaltung der einzelnen Formularelemente mit annähend gleicher Breite */ .webkit .yform .type-text input, .webkit .yform .type-file input.filechooser, .webkit .yform .type-text textarea { display: block; position: relative; padding: 0; width: 100%; /*margin-bottom:16px;*/ resize: none; border: 1px solid #dedede; box-sizing: border-box; } .webkit .yform .type-file input.filechooser { height: auto; } .webkit .yform .type-text textarea { padding: 3px; /*4px 5px 4px 5px*/ height: 102px; /*margin-bottom:16px;*/ resize: none; } .webkit .yform .type-text input { padding: 2px 0 2px 0.4em; /*4px 5px 4px 5px*/ height: 26px; border: 1px solid #959595; } .webkit .yform .type-select select { display: block; position: relative; padding: 0.3em 2px 0.3em 1px; width: 60%; cursor: pointer; } .webkit .yform .type-select select optgroup { font-style: normal; font-weight: bold; } .webkit .yform .type-check input { cursor: pointer; } .webkit .yform .type-check label { display: inline; position: relative; top: -1px; /*in IE hacks: top:1px\9*/ } /* Styling of buttons | Gestaltung von Buttons */ .webkit .yform .type-button input { cursor: pointer; overflow: visible; /* Fixes IE7 auto-padding bug */ width: auto; } /* Styling of error-messages | Fehlermeldungen */ .webkit .yform div.error { background: transparent; border: none; } .webkit .yform div.error.main { background: #f7a707; border: none; color: #000; padding: 5px 5px 5px 33px; margin-bottom: 10px; position: relative; line-height: 20px; } .webkit .yform div.error.main .message, .webkit .yform div.error.main a { color: #000; display: block; line-height: 20px; width: 98%; } .webkit .yform div.error label { color: #000; font-weight: bold; padding-bottom: 9px; } .webkit .yform div.error .message { color: #f7a707; font-weight: bold; margin-bottom: 0 } .webkit .yform div.error .message.mandatory { background-color: #f7a707; color: #000; padding: 6px 8px 6px 30px; position: relative; } .webkit .yform div.error input, .webkit .yform div.error textarea, .webkit .yform div.error select { border: 1px solid #f7a707; background: #fbd383; resize: none; } /* avoid jumping checkboxes & radiobuttons in IE8 */ .webkit .yform div.type-check input:focus, .webkit .yform div.type-check input:hover, .webkit .yform div.type-check input:active { border: 0 none; } /*------------------------------------------------------------------------------------------------------*/ /* Indent Checkbox fields to match label-width | Checkboxen um den gleichen Wert einrücken, wie die Breite der labels */ .webkit .full div.type-text input, .webkit .full div.type-text textarea { width: 95.5%; margin-right: -3px; resize: none; } .webkit .full div.type-select select { width: 97.0%; margin-right: -3px; } /*------------------------------------------------------------------------------------------------------*/ /** * Columnar forms display - technical base (optional) * * |-------------------------------------------| * | fieldset | * |-------------------------------------------| * | | * | label | input / select / textarea | * | | * |-------------------------------------------| * | /fieldset | * |-------------------------------------------| * * (en) Styling of forms where label floats left of form-elements * (de) Formulargestaltung, bei der die label-Elemente nach links fließen * * WARNING:This part contains several IE-stability-fixes. Don't edit this part if you are not sure, what you're doing! */ /* Columnar display | Spalten-Darstellung */ .webkit .columnar .type-text label, .webkit .columnar .type-select label, .webkit .columnar .type-file label { float: left; width: 30%; /* Can be fixed width too | Kann auch eine fixe Angabe sein */ } /* Indent Checkbox fields to match label-width | Checkboxen um den gleichen Wert einrücken, wie die Breite der labels */ .webkit .columnar div.type-check input { margin-left: 30%; } .webkit .columnar div.error .message { margin-left: 30%; } .webkit .columnar fieldset div.type-button, .webkit fieldset.columnar div.type-button { padding-left: 30%; } .webkit .columnar div.type-text input, .webkit .columnar div.type-text textarea, .webkit .columnar div.type-file input.filechooser { float: left; width: 69.8%; margin-right: -3px; resize: none; } .webkit .columnar div.type-select select { float: left; width: 69.4%; margin-right: -3px; } .webkit .columnar { margin-top: 0; margin-right: -28px } .webkit .columnar .cols_6, .columnar .cols_3, .columnar .cols_2, .columnar .cols_full { clear: both; display: block; float: left; overflow: hidden; padding-right: 25px; width: 450px; margin-top: 16px } .webkit .columnar .form_text { margin-bottom: 10px; } .webkit .columnar div.type-text label { position: relative; top: 5px; padding-bottom: 2px; } /*.columnar div.type-text input {width:50px;}*/ .webkit .columnar fieldset div.type-button { clear: both; padding: 0; margin: 16px 0 16px 29%; } /*for 1gfp layout, so the error fields won't disable form layout*/ .webkit #col3_content form.columnar .error .message { display: block !important; } /*------------------------------------------------------------------------------------------------------*/ /** * Global fixes for YAML's form construction set * * @workaround * @affected IE 5.x/Win, IE6, IE7 * @css-for IE 5.x/Win, IE6, IE7 * @valid no */ .webkit .yform, .webkit .yform div, .webkit .yform div * { zoom: 1; } /** * Forms Fieldset/Legend-Bug in IE * @see http://www.mattheerema.com/web-design/2006/04/getting-fieldset-backgrounds-and-legends-to-behave-in-ie/ * * @workaround * @affected IE 5.x/Win, IE6, IE7, IE8 * @css-for IE 5.x/Win, IE6, IE7, IE8 * @valid no */ /*in IE hacks /* all IE * .yform { padding-top:0\9;margin-top:0\9 } .yform fieldset { padding:0\9; padding-top:0\9; } .yform legend { position:absolute\9; top:0\9; *left:0\9; } .yform fieldset { position:relative\9; overflow:visible\9; margin-top:0\9; zoom:1; } /* IE5.x, IE6 & IE7 * .yform legend { *padding:0 5px; } .yform fieldset { *padding-top:0; } /* IE5.x & IE6 * * html .yform { padding-top:0;margin-right:-28px } /* IE7 * *+html .yform { padding-top:0;margin-right:-28px } */ /*Wrth: Anpassung für cols_full-Formular*/ .webkit .cols_full .yform { margin-right: 0; margin-bottom: 40px; } .webkit .cols_full .yform div.type-text, .webkit .cols_full .yform div.type-file, .webkit .cols_full .yform div.type-select, .webkit .cols_full .yform div.type-button { padding-right: 12px; } /*Wrth: Sonstige Anpassungen */ .webkit .yform .type-file .current_file { border: 1px solid #DEDEDE; display: block; padding: 0px 0px 0px 5px; margin-bottom: 5px; height: 25px; line-height: 25px; } .webkit .yform .type-file .current_file input { float: right; border: none; background-color: #DEDEDE; height: 23px; width: 23px; margin: 1px 1px 0px 0px; overflow: hidden; font-weight: bold; cursor: pointer; } .webkit .yform .type-file .filechooser { background-color: #FFF; border: 1px solid #dedede; height: 25px; } .webkit .frontpage .yform fieldset { background-color: #ebebeb; padding: 30px 20px 20px 0; } .webkit .frontpage .yform fieldset .form_text { padding-left: 30px; width: 97%; } .webkit .formContainer .form_text { width: 100%; } //.formContainer {display:inline-block;width:100%;position:relative;padding: 20px 10px 10px 30px;} .webkit .formeditLeftContainer { width: calc(50% - 30px); float: left; display: block; margin: 0 20px 0 0; } .webkit .formeditRigthtContainer { width: calc(50% - 10px); float: left; display: block; margin: 0; } .webkit .yform .type-text input { height: 40px; } .webkit .yform .type-text input, .webkit .yform .type-file input.filechooser, .yform .type-text textarea { border: solid 1px #cdcdcd; } .webkit .yform .type-text textarea { height: auto; } .webkit .yform div.form_text select, .yform div.type-select select { height: 40px; } .webkit .yform div.type-check { padding: 2px 0 0 0 !important; line-height: 20px; } .webkit .yform div.type-check input[type=checkbox], .webkit .yform div.type-check input[type=radio] { position: absolute; visibility: hidden; } .webkit .yform .type-check label { display: block; position: relative; font-weight: 300; //font-size: 1.35em; padding: 0 0 0 30px; margin: 0 auto; min-height: 40px; z-index: 9; cursor: pointer; -webkit-transition: all 0.25s linear; } .webkit .yform .type-check:hover label { //color: #FFFFFF; } .webkit .yform .type-check .checkRadio, .webkit .yform .type-check .checkCheckbx { display: inline-block; vertical-align: baseline; border: 1px solid #cdcdcd; content: " "; position: absolute; background-color: #fff; height: 20px; width: 20px; top: 0; left: 2px; z-index: 5; transition: border .25s linear; -webkit-transition: border .25s linear; } .webkit .yform .type-check .checkRadio { border-radius: 50%; } /* .yform .type-check:hover .checkCheckbx, .yform .type-check:hover .checkRadio { background-color: #959595; border: 1px solid #fff; } input[type=checkbox]:checked ~ .checkCheckbx, input[type=radio]:checked ~ .checkRadio { background-color: #959595; border: 1px solid #fff; transition: border .25s linear; -webkit-transition: border .25s linear; } */ .webkit input[type=checkbox]:checked~.checkCheckbx::before, .webkit input[type=radio]:checked~.checkRadio::before { font-family: 'Wuerthicons'; font-size: 18px; content: "\eb23"; color: #cc0000; left: 3px; top: 2px; position: absolute; //border: solid 1px #cdcdcd; } .webkit input[type=radio]:checked~.checkRadio::before { font-size: 31px; font-family: 'Arial'; content: '\2022'; left: 4px; top: 0px; } .webkit input[type=radio]:checked~label { //color: #0DFF92; } } /****************************** Media Queries for responsive designs ******************************/ @media (max-width: 974px) {} @media screen and (max-width: 730px) { .webkit .formeditLeftContainer { width: 96%; float: left; display: block; margin-right: 0; } .webkit .formeditRigthtContainer { width: 96%; float: left; display: block; } .webkit .columnar .type-text label, .webkit .columnar .type-select label, .webkit .columnar .type-file label, .webkit .columnar div.type-text input, .webkit .columnar div.type-text textarea, .webkit .columnar div.type-file input.filechooser { width: 100%; } } @media screen and (max-width: 478px) {}