/*Form-Element-Style*/
/*****************************************************************************/
#contactForm{ 
    position: relative;
    overflow: auto;
    margin: 20px 0px;
}

#contactForm input[type="text"], 
#contactForm input[type="password"], 
#contactForm input[type="email"],
#contactForm textarea, 
#contactForm select {
	border: 1px solid #432918;
	padding: 4px 4px;
	outline: none;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	color: #777;
	max-width: 100%;
	display: block;
	background: #fff; 
    margin-bottom: 10px;
}

#contactForm select {
    padding: 5px 0;
    height: 29px;
}

#contactForm input[type="text"]:focus, 
#contactForm input[type="password"]:focus,
#contactForm input[type="email"]:focus, 
#contactForm textarea:focus {
    border: 1px solid #aaa;
 	color: #444;
 	-moz-box-shadow: 0 0 3px rgba(0,0,0,.2);
	-webkit-box-shadow: 0 0 3px rgba(0,0,0,.2);
	box-shadow:  0 0 3px rgba(0,0,0,.2); 
}

#contactForm label {
    color: #432918;
}


/*Interaktion*/
/*****************************************************************************/

.dsgvo_error,
#error {
    clear: both;
    color: #B94A48;
}

#succsess {
    clear: both;
    color: rgb(35, 155, 0);
}

#loader {
    float: right;
    padding: 13px 10px;
    display: none;
}

/*SelectBox*/
/*****************************************************************************/

.selectGroup {
    width: 50%; /*  = 100% / row */ 
    float: left;
    
}

.selectGroup label {
    display: block;
    width: 25%;
    float: left;
}

.selectGroup select {
    width: 72.5%;
    
}

/*TextInput*/
/*****************************************************************************/

.inputTextGroup {
    width: 50%; /*  = 100% / row */ 
    float: left;

}

.inputTextGroup label {
    display: block;
    width: 25%;
    float: left;
    margin-right: 7px;
    padding-top: 5px;
}

.inputTextGroup input {
    width: 65%;
}

/*CheckBox*/
/*****************************************************************************/

.checkboxGroup {
    width: 25%; /*  = 100% / row */ 
    float: left;
    margin: 5px 0px;
}

.checkboxGroup label {
    display: block;
}

.checkboxGroup input {
    width: 15px;
    float: left;
}

/*Radio-Button*/
/*****************************************************************************/

.radioButtonGroup {
    width: 25%; /*  = 100% / row */ 
    float: left;
    margin: 5px 0px;
}

.radioButtonGroup label {
    display: block;
}

.radioButtonGroup input {
    width: 15px;
    float: left;
}

/*TextArea*/
/*****************************************************************************/

.textareaGroup {
    width: 100%; /*  = 100% / row */ 
    float: left;

}

.textareaGroup label {
    display: block;
    width: 12.5%;
    float: left;
}

.textareaGroup textarea{ 
    width: 97%;
    height: 100px;
}

/*Captcha*/
/*****************************************************************************/

.captchaGroup {
    clear: both;
}

.captchaGroup #captchaHint {
    float: left;
    width: 170px;
    padding: 4px 0
}

.captchaGroup #captchaBox {
    width: 270px;
    overflow: hidden;
    float: right;
}

.captchaGroup input {
    width: 100px;
    width: 145px;
}

.realperson-challenge {
    display: block;
    color: #000;
    cursor: pointer;
    padding: 11px 0;
    margin: 0 3px;
    float: left;
}

.realperson-text {
    font-family: "Courier New",monospace;
    font-size: 5px;
    font-weight: bold;
    letter-spacing: -1px;
    line-height: 2px;
}

.realperson-regen { 
	padding-top: 4px;
	font-size: 12px;
	text-align: center;
	cursor: pointer;
    display: none;
}

.realperson-disabled {
	opacity: 0.5;
	filter: Alpha(Opacity=50);
}

.realperson-disabled .realperson-regen {
	cursor: default; 
}

/*Buttons*/
/*****************************************************************************/

.buttonGroup {
    float: right;
    margin: 6px 0;
}

.buttonGroup button{
 
    margin: 0 12px 0 12px;
    display: inline-block;
    padding: 4px 20px;
    line-height: 20px;
    color: #333333;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    
    background-color: #f5f5f5;
    background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
    background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
    background-repeat: repeat-x;

    border: 1px solid #bbbbbb;
    border-color: #e6e6e6 #e6e6e6 #bfbfbf;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    border-bottom-color: #a2a2a2;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);

}

/*****************************************************************************/

.kontakt_wrapper {
    margin-bottom: 20px;
    overflow: hidden;

}

.pages_detail {
   border-right: 1px solid #432918; 
}

.pages_detail h2,
.kontaktformular  h2{
    font-size: 18px;
    font-weight: bold;
}

.kontaktformular {
    width: 460px;
    float: left;
}

.pages_detail_beschreibung {
    width: 270px !important;
    float: left;
}

.beschreibung2 {
    clear: both !important;
}

.titelImage {
    float: left;
    margin-left: 20px !important;
}

.lightbox {
    position: relative;
}

.lupe {
   width:25px !important;
   height: 25px;
   position: absolute;
   right:0;
   bottom: 3px;
   z-index:10;
}

#layout_Content {
}

@media (max-width: 768px) {
    .pages_detail {
       border: none;
    }

    .inputTextGroup{
        width: 100%;
    }
}
