@charset "UTF-8";
/*
	urbanstudio usForm
	URI: http://www.urbanstudio.de
	Author: Oli Feiler

*/

/* ---------------------------------------------------------------------------------- */



/* ---------------------------------------------------------------------------------- */

div.form{display:block;width:100%;padding:0 0 0 0;line-height:22px;color:#000000;}
div.usfield{display:block;clear:both;padding-bottom:22px;overflow:auto;}
div.usfield.clear{clear:both;}
div.usfield label{display:block;font-size:16px;font-weight:700;color:#666666;margin-bottom:8px;}
div.usfield label span{color:#000000;font-weight:400;}
div.usform-wrap{}

div.usform-wrap input, div.usform-wrap textarea, div.usform-wrap select{display:block;}
div.usform-wrap input, div.usform-wrap textarea{border:1px solid #D3D3D3;box-sizing:border-box;width:100%;padding:8px;color:#666;background:#FFFFFF;font-size:16px;font-family:'Open Sans', sans-serif;font-weight:400;}
div.usform-wrap textarea{height:180px;}
div.usform-wrap input[type="text"], div.usform-wrap textarea{outline:0px 1px 0px #FFFFFF;outline-bottom:solid;}

div.usform-wrap input:focus, div.usform-wrap textarea:focus{background-color:#FFFFFF;border:1px solid #666666;color:#000000;outline:none;}
div.usform-wrap input[type="radio"]{width:16px;margin-top:5px;border:0;} div.usform-wrap input[type="checkbox"]{width:auto;margin-top:5px;border:0;}

div.usform-wrap.select{border:1px solid #D3D3D3;width:698px;padding:0;color:#666;background:#FFFFFF;font-size:14px;font-family:'Open Sans', sans-serif;font-weight:400;}

div.usform-wrap select, div.usform-wrap select:focus{width:140px;padding:2px;outline:none;}
div.usform-wrap select.list{border:1px solid #CCC;width:148px;padding:3px;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;margin-bottom:8px;color:#666;}
div.usform-wrap select.list.double{width:268px;} div.usform-wrap select.list.nolabel{margin-left:20px;}

.usform-horizontal-checklist{float:none;clear:both;}
.usform-horizontal-checklist div.usform-wrap{display:block;height:auto;width:160px;float:left;overflow:auto;padding-bottom:5px;}
.usform-horizontal-checklist input{margin-right:10px;display:inline;float:left;width:18px;}
div.usfield .usform-horizontal-checklist label{color:#000000;font-weight:400;padding:0 10px 0 0;margin-left:20px;margin-bottom:0;cursor:pointer;}

.usform-vertical-checklist{float:none;clear:both;}
.usform-vertical-checklist div.usform-wrap{display:block;height:auto;width:auto;float:none;overflow:auto;padding-bottom:5px;}
.usform-vertical-checklist input{margin-right:10px;display:inline;float:left;width:18px;}
div.usfield .usform-vertical-checklist label{color:#000000;font-weight:400;padding:0 10px 0 0;margin-left:20px;margin-bottom:0;cursor:pointer;white-space:nowrap;}

.usbutton{clear:both;margin-bottom:10px;}


/* -- FLOATING FORM -------------------------------------------------------------------------------- */

div.form{overflow:auto;}
div.form div.usfield{float:left;clear:none;}
div.form div.usfield.clear{clear:both;}
div.form div.usfield.full{width:100%;}
div.form div.usfield.half{width: calc( ( 100% - 40px ) / 2 );margin-right:40px;}
div.form div.usfield.half.last, div.form div.usfield.half.no-margin{margin-right:0;}
div.form div.usfield.half div.usform-wrap input, div.form div.usfield.half div.usform-wrap textarea{width: 100%;}

div.form div.usfield.half div.usform-wrap input.street{width:255px;margin-right:15px;float:left;}
div.form div.usfield.half div.usform-wrap input.streetnr{width:40px;float:left;}
div.form div.usfield.half div.usform-wrap input.zip{width:60px;margin-right:15px;float:left;}
div.form div.usfield.half div.usform-wrap input.city{width:235px;float:left;}

div.form div.usfield.half div.usform-wrap.select{border:1px solid #D3D3D3;width:336px;padding:0;height:35px;overflow:hidden;background:#FFFFFF url('https://www.jeannine-platz.de/wp-content/themes/jp2017/images/select-arrow.png') no-repeat 100% 50%;cursor:pointer;}
div.form div.usfield.half div.usform-wrap.select select{display:block;border:0;background:transparent;color:#000000;font-size:14px;font-family:'Open Sans', sans-serif;font-weight:400;-webkit-appearance:none;text-transform:none;cursor:pointer;width:358px;height:35px;padding:8px;}

div.usform-wrap textarea#kommentar{height:100px;}


/* -- ERROR / SUCCESS -------------------------------------------------------------------------------- */

div.usfield.error label{color:#CC0000;}
div.usfield.error div.usform-wrap input, div.usfield.error div.usform-wrap textarea{border-color:#CC0000;}
div.usfield.success label{color:#2DB200;}
div.usfield.success div.usform-wrap input, div.usfield.success div.usform-wrap textarea{border-color:#2DB200;}


/* -- FILTER FORM 280px -------------------------------------------------------------------------------- */

div.form.filterform{}
div.form.filterform div.usfield{float:none;}
div.form.filterform div.usfield div.usform-wrap input, div.form.filterform div.usfield div.usform-wrap textarea{width:242px;}
div.form.filterform div.usfield div.usform-wrap input[type="checkbox"]{width:auto;}



/* -- PLACEHOLDER -------------------------------------------------------------------------------- */
div.usform-wrap input::-webkit-input-placeholder{font-size:12px;font-family:'Open Sans', sans-serif;font-weight:300;font-style:italic;text-transform:none;color:#999999;}
div.usform-wrap input:-moz-placeholder { /* Firefox 18- */ font-size:12px;font-family:'Open Sans', sans-serif;font-weight:300;font-style:italic;text-transform:none;color:#999999;}
div.usform-wrap input::-moz-placeholder {  /* Firefox 19+ */ font-size:12px;font-family:'Open Sans', sans-serif;font-weight:300;font-style:italic;text-transform:none;color:#999999;}
div.usform-wrap input:-ms-input-placeholder{font-size:12px;font-family:'Open Sans', sans-serif;font-weight:300;font-style:italic;text-transform:none;color:#999999;}
div.usform-wrap input:focus::-webkit-input-placeholder{color:transparent;}
div.usfield.antispam{display:none;}



/* -- BUTTONS -------------------------------------------------------------------------------- */
a.button {
  display: inline-block;
  color: #FFFFFF;
  font-size: 14px;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-weight: 700;
  padding: 6px 15px 6px 15px;
  width: auto;
  text-align: center;
  line-height:26px;
  border: 0;
  border-radius: 3px;
  text-decoration: none;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  margin: 0 0 40px 0;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.2);
  cursor: pointer; }
a.button:hover{color:#FFFFFF !important;}

.form a.button {
  padding: 6.5px 15px 6.5px 15px; }

a.button.blue {
  background: #074B90;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1);
  border: 1px solid rgba(0, 0, 0, 0.1);
  margin-bottom: 0 !important; }

a.button.blue:hover {
  background:#06407A; }

a.button.green {
  background: #2DB200;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1);
  border: 1px solid rgba(0, 0, 0, 0.1);
  margin-bottom: 0 !important; }

a.button.green:hover {
  background: #20A000; }

a.button.yellow {
  background: #FFBF00;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1);
  border: 1px solid rgba(0, 0, 0, 0.1);
  margin-bottom: 0 !important; }

a.button.yellow:hover {
  background: #FFAE00; }

a.button.red {
  background: #D90000;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1);
  border: 1px solid rgba(0, 0, 0, 0.1);
  margin-bottom: 0 !important; }

a.button.red:hover{background:#C50000;}

a.button.gray {
  background: #888888;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1);
  border: 1px solid rgba(0, 0, 0, 0.1);
  margin-bottom: 0 !important; }

a.button.gray:hover{background:#666666;}

a.button.lightgray {
  background: #CCCCCC;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1);
  border: 1px solid rgba(0, 0, 0, 0.1);
  margin-bottom: 0 !important; }

a.button.lightgray:hover{background:#AAAAAA;}
a.button i.fa{margin:0 6px 0 -4px;}

a.button.btncenter{margin:0 auto;}



/* -- BLACK -------------------------------------------------------------------------------- */
body.black div.form{background:none;color:#FFFFFF;}
body.black div.usfield label{color:#FFFFFF;}
body.black div.usfield label span{color:#FFFFFF;font-weight:400;}
body.black div.usform-wrap input, body.black div.usform-wrap textarea{border:1px solid #FFFFFF;background:#184176;color:#FFFFFF;}
body.black div.usform-wrap input[type="text"], div.usform-wrap textarea{outline:none;}

/* -- WHITE -------------------------------------------------------------------------------- */
body.white div.form{background:none;color:#184176;}
body.white div.usfield label{color:#184176;}
body.white div.usfield label span{color:#184176;font-weight:400;}
body.white div.usform-wrap input, body.white div.usform-wrap textarea{border:1px solid #184176;background:#FFFFFF;}
body.white div.usform-wrap input[type="text"], div.usform-wrap textarea{outline:none;}

/* -- RESPONSIVE -------------------------------------------------------------------------------- */
@media only screen and (max-width: 667px) {

div.form{width:auto;}
/*div.usform-wrap input, div.usform-wrap textarea,
div.form div.usfield.half div.usform-wrap input, div.form div.usfield.half div.usform-wrap textarea{width:282px;}
div.form div.usfield.half div.usform-wrap input.city{width:207px;}*/

div.form div.usfield{float:none;clear:none;}
div.form div.usfield.clear{clear:both;}
div.form div.usfield.half{width:100%;margin-right:0;}
div.form div.usfield.half.last, div.form div.usfield.half.no-margin{margin-right:0;}
div.form div.usfield.half div.usform-wrap input,
div.form div.usfield.half div.usform-wrap textarea,
div.form div.usfield.full div.usform-wrap textarea{width:100%;}

div.form div.usfield.half div.usform-wrap input.street{width:282px;margin-right:12px;float:left;}
div.form div.usfield.half div.usform-wrap input.streetnr{width:40px;float:left;}
div.form div.usfield.half div.usform-wrap input.zip{width:60px;margin-right:12px;float:left;}
div.form div.usfield.half div.usform-wrap input.city{width:218px;float:left;}

div.form div.usfield.half div.usform-wrap.select{width:282px;}
div.form div.usfield.half div.usform-wrap.select select{width:282px;}

}

@media only screen and (max-width: 479px) {
a.button{box-sizing:border-box;width:100%;}
}