/* Front Form Styles  frontform.css included by mod_forms_new.php */

.frontform {width: 100%;}
.frontform, .frontform * {box-sizing: border-box}

.frontform .heading{margin-bottom: 1rem !important}
.frontform .groupdesc {margin-bottom: .6em}

.frontform fieldset {
  border: 1px solid #ebebeb;
  padding: .5rem 1rem;
  margin-bottom: 1rem;
}

.frontform [required], .frontform .required input{background-color: aliceblue !important}
.frontform .required > label > span:after, .frontform .required > span:first-of-type:after{content: '*'}

.frontform fieldset fieldset {margin: 0 0 .5rem 0; border:0}
.frontform legend {font-weight: bold;}

.frontform .field,.frontform div.desc{max-width:100%; min-height: 1.5em; padding: 0 0 .4em;clear:both}
.frontform .desc{padding-bottom: .6em}
.frontform span.field{display:inline-block}
.frontform label > span:first-child {display:inline-block;min-width: 8rem; margin-right: .5rem; line-height:1.5rem;}
.frontform div.field.has-button > label:last-child{margin-left:.4em}

.frontform div.field.html div{display:inline-block}

textarea.editor {
  color: black;
  display: block;
  height: 100px;
  margin-bottom: 0.4em;
  min-height: 100px;
  min-width: 98%;
}
.frontform img, .frontform input {vertical-align: middle;}

/*INPUT Width*/
.frontform input:not([type='button']):not([type='reset']):not([type='submit']):not([type='checkbox']):not([type='radio']),
.frontform textarea,  .frontform select{width: calc(100% - 8.5rem);}
.frontform input:not([type='button']):not([type='reset']):not([type='submit']):not([type='checkbox']):not([type='radio']).has-button{
  width:calc(100% - 8.5rem - 22px);
  max-width:calc(51.5rem - 22px);
}
.frontform a.link.icon-only{margin-right: 0; vertical-align: baseline}

.frontform select{min-width:8rem;}
.frontform select.textbox {min-width: 13rem;}

.frontform label > [type="checkbox"], label > [type="radio"] {width: auto;}

.frontform input[type="number"], .frontform input[type="radio"],.frontform input[type="checkbox"], .frontform input.button, .frontform input.radio,
.frontform input.easyui-datebox, .frontform input.captcha {width:auto}
.frontform input[type='button'], .frontform input[type='submit'], .frontform input[type='reset']{width: auto; padding: 0 .8rem; margin: .2rem .4rem .2rem 0}

.label-special span {padding-right: 1em}

.frontform .textarea label > span:first-child {vertical-align: top}
.frontform .textfeld label > span:first-child {display:block;}

.frontform .listelement {margin:.3rem 0 .3rem}
/* Labels der Options */
.frontform .listelement label, .frontform .radio label {display: inline-block; line-height: 1.2; margin-right:.4rem; vertical-align: middle}
/* "Label" des Elements */
.frontform .listelement > span:first-child, .frontform .radio label>span:first-child {display: inline-block; min-width: 8rem; margin-right: .5rem; vertical-align: middle}
.frontform .list.block > label{display:block;margin:.4rem 0}

.frontform div.field.plzort input.plz{ width:13%;max-width:13%; min-width: 0}
.frontform div.field.plzort label:nth-child(2) > span:first-child{display:inline-block !important; width:2%;max-width:2%; min-width: 0; margin-right: 0;}
.frontform div.field.plzort input.ort{width:calc(85% - 8.5rem);max-width:calc(85% - 8.5rem); min-width: 0}

.frontform img.captcha{margin:0 .4rem .4rem 0}
.frontform input.captcha{max-width: 150px}

.label-special {padding-right: 1em}

.max-100 input, .max-100 textarea, .max-100 select, input.max-100, textarea.max-100, select.max-100, a.max-100{max-width:6rem !important}
.max-300 input, .max-300 textarea, .max-300 select, input.max-300, textarea.max-300, select.max-300, a.max-300{max-width:18rem !important}
.max-400 input, .max-400 textarea, .max-400 select, input.max-400, textarea.max-400, select.max-400, a.max-400{max-width:25rem !important}

.frontform input.number{max-width:4rem !important}

div.imageselect {padding:.5rem 0}
div.imageselect span.preview{float:left; display:inline-block; width:60px; height:45px;min-height:45px;border:1px solid silver; margin: 0 .4rem 0 0; text-align: center}
div.imageselect span.preview img{max-width:100%; max-height: 100%; vertical-align: top;}
div.imageselect span.control {display: inline-block; vertical-align: top; width: calc(100% - 8.5rem)}
div.imageselect span.buttons{display:block}


a.action, input.action{
  display:inline-block;
  width:100% !important;
  height: auto !important;
  padding: .2rem !important;
  margin:.4rem 0 .2rem 0 !important;
  text-align:center;
  line-height: 1.1rem;
  background:#0053A1;
  color:white !important;
  font-weight:600 !important;
  border:none !important;
}

.frontform span.textbox.easyui-fluid{width:calc(100% - 8.5rem) !important;}
.frontform .imageselect span.textbox.easyui-fluid{width:calc(100% - .4rem - 60px) !important;}
.frontform input.textbox-text{width:calc(100% - 20px) !important;}

@media screen and (max-width: 39.9375em){
  div.imageselect span.control{display: block; margin-left: 0}
}

@media only screen and (max-width : 1280px) {
  .frontform input:not([type='button']):not([type='reset']):not([type='submit']):not([type='checkbox']):not([type='radio']),
  .frontform textarea, .frontform select, .frontform label:not(.label-special) {width: 100%;}
  .frontform:not(#fixform) label > span:first-child{display:block;}

  .frontform div.field.plzort input.plz{width:15%;max-width:15%; min-width: 0}
  .frontform div.field.plzort input.ort{width:83%;max-width:83%; min-width: 0}

    .frontform span.textbox.easyui-fluid{width:calc(100% - 2px) !important;}
.frontform input.textbox-text{width:calc(100% - 22px) !important;}
}

@media screen and (max-width:980px)  {
  .textfeld, .absenden{width:100% !important;}
}

@media screen and (max-width:800px)  {
  .textfeld, .absenden{width:100%;}
  .frontform input,.frontform textarea{max-width: 100%;width:100%;}
  .frontform .plz{ max-width:calc(100% - 3.95rem); }
  .frontform{max-width:95vw;}
  .frontform .textfeld > .fields > .field label span:first-child {padding-top:0;}
  .frontform .field:not(.radio) label span:first-child{display:block;padding:0;}
  .frontform fieldset fieldset{padding:.5rem 0;margin:1rem 0 0;}


}