.clearall{
    clear: both; 
    line-height: 0;
    height: 0;
    font-size:0;
}
/* ==== Anfang email ====================================*/
#emailformular {
    font-size: 120%;
    /*width: 90%;*/
}
#emailformular a, #emailformular a:visited {
    text-decoration: underline; 
    color: #000;
}
#emailformular a:focus,
#emailformular a:hover, 
#emailformular a:active { 
    color: #000;
    text-decoration: none; 
}

#pflichtfeld {
    width: 80%;
    text-align: right;
}

fieldset {
    border: 0;
    margin-bottom: 20px;
}
 
legend {
    /*font-weight: bold;*/
    padding-left: 10px;
    padding-right: 10px;
    
}

#emailformular .formularfeld input[type="text"] , #emailformular .formularfeld input[type="text"]:visited {
    border: 0;
    border-bottom: 1px solid #000;
    /*background-color : #d1d1d1; */
}
#emailformular .formularfeld input[type="text"]:focus,
#emailformular .formularfeld input[type="text"]:hover, 
#emailformular .formularfeld input[type="text"]:active { 
    border: 0;
    border-bottom: 1px solid #000;
       outline: none;
       /*background-color : #d1d1d1; */
  /*  border: none;*/
}

.formularfeld {
    clear:both;
    margin-bottom: .5em;
}
.formularfeld input[type="text"]{
    font-size: 90%;
}
.formularfeld textarea {
    font-size:  1rem;
}
.formularfeld select  {
    font-size: 90%;
}

#eingabefehler {
    margin-bottom: .3em;
    font-size: 110%;
    font-weight: bold;
}

#emailformular h3 {
    font-size: 100%;
    margin-bottom: .5em;
 }
 
.nachrechtsemail {
    float: left;
    width: 20%;
    text-align: right;
    vertical-align: bottom;
 }
 
.nachlinksemail {
    /*padding-left: .5em;*/
    float: left;
    width: 65%;
width: 60%;
    vertical-align: bottom;
 }
.nachlinksemail p {
    font-size: 80%;
}


.hinweis {
    width: auto;
   /* background-color: lime;*/
    font-size: 80%;
    padding-left: 80px;
}

#emailformular .checkbox {
    border: 0 none;
    float: left;
    margin: 1px 5px 0 0;
    padding: 0;
    width: auto;
    /*margin-bottom: 100px;*/
}

.fehler {
    color: #f00; 
}
.notSelectable {
    font-style: italic;
    color: #333 !important;

}

.go {
    cursor: pointer;
    background-color: #dadada;
    border: 1px solid #666;
   
    
/*    background-image: url(../pix/button-send.gif);
    background-repeat: no-repeat;
    background-position: 8px 4px;*/
    /*font-family: Verdana, Arial, Helvetica, sans-serif;*/
    color: #666;
    font-size: 90%;
    /*font-weight: bold;*/
    margin-top: 5px;
    padding: 4px 8px;
    float:right;
}


/*body.kontaktSeite p.kontaktadresse a:link {

}
body.kontaktSeite p.kontaktadresse a:visited {}
body.kontaktSeite p.kontaktadresse a:hover, body.kontaktSeite p.kontaktadresse a:focus {
    text-decoration: none;
}
body.kontaktSeite p.kontaktadresse a:active{  }
body.kontaktSeite p.kontaktadresse a { 
    text-decoration: underline; 
    outline: none;
}*/
#inhalt #emailformular form span.datenschutzText {
    font-size: 80%;
}
#inhalt #emailformular form #datenschutzSubmitWrapper {
    background-color: #f0f0f0;
    padding: 10px;
    width: 80%;
    margin: 0 auto;
    text-align: left;
}


/* Advanced Checkbox Hack */

/* 
 * pseudo-class + general/adjacent sibling doesn't work
 * on Android <= 4.1.2 so we need a hack:
 *
 * A useless animation :D
 */
body { -webkit-animation: bugfix infinite 1s; }
@-webkit-keyframes bugfix { from {padding:0;} to {padding:0;} }



#submitWrapper {
    position: relative;
    height: 3em;
}


input.go {
    position: absolute;
    top: .5em;
    left: 0;
/*  width: 200px;
    height: 50px;*/
    /*display: none;*/
    /*opacity: .5;*/
}

div input#fake {
   display: block;
     cursor: not-allowed;
  user-select: none;
  opacity: .6;
}
div input#real {
   display: none;
}
input[type=checkbox]#datenschutz:checked ~ div input#fake {
   display: none;
   
}
input[type=checkbox]#datenschutz:checked ~ div input#real {
   display: block;
   
}




/*select {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: transparent;
  border: none;
  padding: 0 1em 0 0;
  margin: 0;
  width: 100%;
  font-family: inherit;
  font-size: inherit;
  cursor: inherit;
  line-height: inherit;
  z-index: 1;
  outline: none;
}
select::-ms-expand {
  display: none;
}

.select {
  display: grid;
  grid-template-areas: "select";
  align-items: center;
  position: relative;
  min-width: 15ch;
  max-width: 30ch;
  border: 1px solid var(--select-border);
  border-radius: 0.25em;
  padding: 0.25em 0.5em;
  font-size: 1.25rem;
  cursor: pointer;
  line-height: 1.1;
  background-color: #fff;
  background-image: linear-gradient(to top, #f9f9f9, #fff 33%);
}
.select select, .select::after {
  grid-area: select;
}
.select:not(.select--multiple)::after {
  content: "";
  justify-self: end;
  width: 0.8em;
  height: 0.5em;
  background-color: var(--select-arrow);
  -webkit-clip-path: polygon(100% 0%, 0 0%, 50% 100%);
          clip-path: polygon(100% 0%, 0 0%, 50% 100%);
}

select:focus + .focus {
  position: absolute;
  top: -1px;
  left: -1px;
  right: -1px;
  bottom: -1px;
  border: 2px solid var(--select-focus);
  border-radius: inherit;
}

*/







/* ==== Ende email ====================================*/
@media only screen and (min-width: 1px) and (max-width: 800px) {


    fieldset legend{
        font-size: 120%;
        text-decoration: underline;
        margin-bottom: .5em;
    } 
    #emailformular {
        width: initial;
    }

    .nachrechtsemail {
        display: block;
        float: none;
        width: initial;
        text-align: center;
    }
        
    .nachlinksemail {
        display: block;
        float: none;
        width: initial;
        text-align: center;
    }

    .formularfeld input[type="text"], 
    .formularfeld textarea,
    .formularfeld select {
        width: 100%;
    }

}