/**
 * Main Settings
 */
 

div.tx-powermail {
	margin: 0;
	padding: 0;
	overflow:hidden;
}

div.tx-powermail h3 {
	   font-size:120%;
  color:#636365;
  margin-top: 30px;
  margin-bottom: 20px;
  display:none;
}

.clear {
	clear: both;
}

/**
 * Form
 */
.powermail_form {
	position: relative;
}

.powermail_fieldset {
	clear: left;
	border: 0;
	padding: 2rem 1rem;
	margin-bottom: 30px;
	border: 1px solid #ccc;
}

.powermail_legend {
	font-weight: bold;
	font-size:140%;
	white-space:normal;
	width:auto;
	padding:0 1rem;
}

.powermail_fieldwrap_datenschutz {clear:both;}
.powermail_fieldwrap_konfiguration { display:none;}

.powermail_input, .powermail_captcha  {width:100%; padding:0.5rem; border:1px solid #ccc; background:#faf9f8}
.powermail_textarea {width:100%; padding:0.5rem; border:1px solid #ccc; background:#faf9f8}
.powermail_fieldwrap_konfiguration  {width:100% !important; max-width:100% !important;}
.powermail_fieldwrap_konfiguration .col-sm-2 {display:none !important;}
#powermail_field_konfiguration {background:#fff; border:0; width:100%; padding:0.5rem;}
.powermail_fieldwrap {margin:0.5rem 0;}

.control-label {font-size:1rem; font-weight:400;}
.powermail_fieldwrap_uid23 .control-label {font-size:0.875rem; font-weight:300;}

span.mandatory {
   color:#FF0000;
   padding: 0 0 0 3px;
}
.parsley-required {color:red;}
.parsley-custom-error-message {color:red;}

#powermail_field_anrede {width:120px;}


.powermail_check_legend { border:0; font-size: 100%}
.powermail_radio_legend { border:0; font-size: 100%}


input.powermail_captcha {
  margin:0 0 0 0;
  width: 50%;
}

img.powermail_captchaimage {
 padding:0;
 margin-top: 10px;
 width:50% !important;
}

.powermail_captcha_outer {  width:60% !important;}

input.readonly { width:100%; padding:3px 0;cursor:default;}  

.powermail_textarea {
	height: 30%;
}
input.powermail_field:focus {
	background-color: #fff;
	border: 1px solid #999;
	outline: none;
}

.btn-primary {
    border: 0; 
	padding:1rem 3rem;
    background: #1378c7;
	color:#fff;
	font-weight:400;
	margin:10px 0 0 0;
	cursor:pointer;
	font-size:1rem;
	font-weight:bold;
   -webkit-radius: 3px;
   -moz-border-radius: 3px;
   border-radius: 3px;
}

.print-btn {
    border: 1px solid #1378c7; 
	padding:1rem 2.75rem;
    background: #fff;
	color:#1378c7;
	font-weight:400;
	display:inline-block;
	margin:10px 0 0 0;
	cursor:pointer;
	font-size:1rem;
	font-weight:bold;
   -webkit-radius: 3px;
   -moz-border-radius: 3px;
   border-radius: 3px;
}



.powermail_fieldwrap_radio fieldset,
.powermail_fieldwrap_check fieldset {
	padding: 0;
	margin: 0;
	border: 0;
}
.powermail_fieldwrap_radio fieldset legend,
.powermail_fieldwrap_check fieldset legend {
	padding: 0;
}
.powermail_radio_outer,
.powermail_captcha_outer,
.powermail_check_outer {
	float: left;
	padding: 3px;

}
.powermail_check_inner {
  margin: 0 0 8px 0;
}



div.error {
	background-color: #FFCA4B;
	border: 1px solid #FF8100;
}
.powermail_field_error {
	background-color: #FFCA4B;
	border: 1px solid #FF8100;
}
div.powermail_fieldwrap_file_inner {
	overflow: hidden;
	height: 26px;
	padding: 3px;
	color: white;
	font-weight: bold;
	cursor: pointer;
	background-image: url('/typo3conf/ext/powermail/Resources/Public/Image/upload_bg.png');
}
input.powermail_file {
	position: relative;
	height: 100%;
	width: auto;
	
}
.powermail_fieldwrap_type_file {padding-left:1rem;}

.ui-datepicker-next span,
.ui-datepicker-prev span {
	text-indent: -99999px;
	cursor: pointer;
}

/* Bewerbungsformular */
.btn-group {
	 display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
	margin-bottom:3rem;
}
.powermail_tab_navigation button:disabled,
.powermail_tab_navigation button[disabled]{
  background: url(../Images/step_disable.png) no-repeat 50% 50%;
   margin-top: 4rem;
    margin-bottom: -3.75rem;
}
.powermail_tab_navigation button:not([disabled]),
.powermail_tab_navigation button:not(:disabled) {
  background: url(../Images/step_current.png) no-repeat 50% 50%;
      margin-top: 4rem;
    margin-bottom: -3.75rem;
}
.step { 
	text-align:center; 	
	font-weight:500;
	font-size:1.25rem;
	padding:18px 0;
	background:url(../Images/step_normal2.png) no-repeat 50% 50%;
	}
.step2 { width:48%; }
.step3 { width:31%; }	
.step4 { width:24%; }
.step5 { width:18%; }	
.step6 { width:15%; }			
.step.iterationPageActive {background:url(../Images/step_current.png) no-repeat 50% 50%; color:#fff;}

.checkalert {padding-bottom:1rem;}

.form2check .powermail_legend {display:none;}
.form2check .powermail_fieldwrap_type_radio .powermail_label,
.form2check .powermail_fieldwrap_type_check .powermail_label {float:none; width:100%; font-size:1.25rem; text-align:center !important; font-weight:700; margin-bottom:1rem; display:block;}
.form2check .powermail_fieldwrap_type_radio .powermail_field_error_container {width:100%; height:0;}
.form2check .powermail_fieldwrap_type_check .powermail_field{    
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;}
.form2check .powermail_fieldwrap_type_radio .powermail_field{    
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;}	
.form2check .powermail_fieldwrap_type_check .checkbox {
	display: flex;
    flex-direction: column;
    align-items: center;
}
.form2check img {height:100px; margin:0 auto 1rem auto;}

.form2check .powermail_fieldwrap_type_check .checkbox label{ 
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  cursor: pointer;
  width:100%;
  background-color: #0081c9;
  border:2px solid #0081c9;
  color: white;
  padding: 5rem 10px;
  border-radius: 3px;
  transition: all .3s ease-out;}

.form2check .powermail_fieldwrap_datenschutz .checkbox label{ background:transparent;} 
.checkbox.sp3 {
    background: #0081c9;
    padding: 2rem !important;
} 
.form2check .sp1 {
    background: none;
    color: #000;
    padding: 0;
}
.form2check .sp1 a{color: #000; }
.form2check .powermail_submit {
	background:#0080C9; border:0; padding:10px 1rem; color:#fff; float:right; margin-right:1rem;
}
.form2check .powermail_fieldwrap_type_check .checkbox input[type="checkbox"]:checked {
  box-shadow: 0 0 0 3px hotpink;
}
.form2check .powermail_fieldwrap_type_radio .radio {
	display: flex;
    flex-direction: column;
    align-items: center;
    padding-bottom: 1rem;
	width:30%;
}
.form2check .powermail_fieldwrap_type_check .checkbox.sp2,
.form2check .powermail_fieldwrap_type_radio .radio.rs2 {width:45%; padding:1rem;}
.form2check .powermail_fieldwrap_type_check .checkbox.sp3,
.form2check .powermail_fieldwrap_type_radio .radio.rs3 {width:30%; padding:1rem;}
.form2check .powermail_fieldwrap_type_radio .radio.rs4 {width:45%; padding:1rem;}
.form2check .powermail_fieldwrap_type_check .checkbox.sp4 {width:50%; padding:1rem 2rem;}

.form2check input {  
    height: auto;
    line-height: 1.75em;}

.form2check .powermail_fieldwrap_type_radio .radio input[type="radio"]{
  visibility: hidden;
  height: 0;
  width: 0;
}
.form2check .powermail_fieldwrap_type_radio .radio label {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  cursor: pointer;
  width:100%;
  background-color: #0081c9;
  color: white;
  padding: 4rem 10px;
  border-radius: 3px;
  transition: all .3s ease-out;
}
.form2check .powermail_fieldwrap_type_radio .radio label:hover,
.form2check .powermail_fieldwrap_type_check .checkbox:hover {box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px; }
.form2check .powermail_fieldwrap_datenschutz .checkbox:hover {box-shadow: none; }
.form2check .powermail_fieldwrap_type_radio .radio input[type="radio"]:checked + .form2check .powermail_fieldwrap_type_radio .radio label{
  background-color: #58ba83;
}
.form2check .powermail_fieldwrap_datenschutz .powermail_label {display:none; }
.form2check .powermail_fieldwrap_datenschutz .powermail_field {display:block;  }
.form2check .powermail_fieldwrap_datenschutz .powermail_field .checkbox label{ padding:0; text-align:left; background:transparent;color:#54565A; border:0; }




/**
 * Confirmation
 */
.powermail_confirmation {
	clear: left;
	border: 0;
	padding: 10px;
	margin-bottom: 20px;
	background: #ccc;
}
input.powermail_confirmation_form {
	float: left;
	margin-top: 20px;
	padding: 5px 20px;
	color: white;
	font-weight: bold;
	cursor: pointer;
	background: rgb(30,87,153); /* Old browsers */
}
input.powermail_confirmation_submit {
	float: right;
	margin-top: 20px;
	padding: 5px 20px;
	color: white;
	font-weight: bold;
	cursor: pointer;
	background: rgb(30,87,153); /* Old browsers */
}



@media screen and (max-width: 800px) {
.powermail_fieldset [class*="col-4"] { width: 100%; } 
}


@media screen and (max-width: 600px) {
	.powermail_fieldset .col-md-6	{
	width: 100%; 
	max-width: 100%;
    float:none;
    }
	   
}


@media screen and (max-width: 600px) {
.form2check .powermail_fieldwrap_type_check .checkbox.sp2,
.form2check .powermail_fieldwrap_type_radio .radio.rs2 {width:100%; padding:1rem;}
.form2check .powermail_fieldwrap_type_check .checkbox.sp3 {width:100%; padding:1rem;margin-bottom:1rem;}
.form2check .powermail_fieldwrap_type_radio .radio.rs3 {width:100%; padding:1rem;}
.form2check .powermail_fieldwrap_type_radio .radio.rs4 {width:100%; padding:1rem;}
.form2check .powermail_fieldwrap_type_check .checkbox.sp4 {width:100%; padding:1rem 2rem; margin-bottom:1rem;}
.powermail_fieldset .row .col-sm-10, .powermail_fieldset .row .col-sm-2{padding:0; }
.powermail_fieldset {
	clear: left;
	border: 0;
	padding: 2rem 0;
	margin-bottom: 40px;
	border: 1px solid #ccc;
}	
.powermail_field {
	width: 70%;
	padding: 3px;
	border: 1px solid #ccc;
}

.powermail_submit {
	width:90%;
	margin:10px 0 0 0;
}
.powermail_label {
	/* label */
	display: block;
	width: 100%;
	float: none;
	clear: both;
}

.powermail_field {
	width: 100%;
	padding: 3px;
	border: 1px solid #193c6c;
}
.form2check .powermail_field { border:0;}

input.powermail_captcha {
  margin:0 0 0 0;
}

img.powermail_captchaimage {
 padding:0 0 0 0;
}

}

@media screen and (max-width: 375px) {
img.powermail_captchaimage {
 padding:0;
 margin-top: 10px;
 width:100% !important;
}
}