/*  -------------------------------------------------------------
    Formulare
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
          .datei         schritt11.html
          .kapitel       8
    -------------------------------------------------------------   */

/*  -------------------------------------------------------------
    1. GLOBAL RESET
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -   */
               * {
                    margin: 0;
                    padding: 0;
               }

/*  -------------------------------------------------------------
    2. STRUKTUR
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -   
               body {
    font-family: Helvetica, Arial, Geneva, Swiss, SunSans-Regular;
    line-height: 26px;
    font-size: 12px;
    color: black;

               }
               */

               div#wrapper {
                    /* Allgemeines Container */
                margin: 0;
                width: 770px;
               }

               div#content {
                    /* Sub-Container, wird nach rechts verschoben, da links bei einem Formulare
                    weitere Elemente stehen werden. Typische Alternative: margin: 0 auto; */
                    margin: 0 auto;
                padding: 0 5px 0 0;
                text-align: left;
                width: 500px;
               }
               
               .contactleft {
                    /* Linker Bereich des Formulars: für Labels */
                    width: 120px;
                    clear: left;
                    float: left;
                    display: inline;
                    padding: 4px;
                    margin: 10px 0;
                    text-align: right;
               }
               .contactright {
                    /* Rechter Bereich des Formulars: für Eingabefelder */
                    text-align: left;
                    float: left;
                    display: inline;
                    padding: 4px;
                    margin: 5px 0;
               }      
                       
               .email_urlaubsgesuche_nospam {
                    /* Rechter Bereich des Formulars: für Email Eingabefelde mit No Spam Logo*/
                    clear:left;
                    position: absolute; 
                    left: 390px;
                    top: 175px;
                    z-index: +1;
                    border: none;
               }
               
               .wrong {
                    /* Rechter Bereich des Formulars: für Eingabefelder */

                    text-align: left;
                    float: left;
                    display: inline;
                    padding: 4px;
                    margin: 5px 0;
               }

/*  -------------------------------------------------------------
    3. GESTALTUNG VON EINGABEFELDERN
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -   */
               input, textarea, select {
                    border: 2px solid #9c7233;
                    -moz-border-radius: 3px; 
               }

               .contactform {
                    /* Hintergrundebene mittels overflow */
                    height: 100%;
                    overflow: auto;
                    background-color: #fff;
                    -moz-border-radius: 6px;
               }
               
               .contactform_login {
                    /* Hintergrundebene mittels overflow */
                    height: 100%;
                    overflow: auto;
                    -moz-border-radius: 6px;
               }

               .contactform #Name,
               .contactform #Email,
               .contactform #Email2,
               .contactform #Site,
               .contactform #Feedback,
               .contactform #Betreff{
                  
                    padding: 5px; 
                    color: #000000;
                    font: 1.1em/1.6em Arial, "Trebuchet MS", Verdana, sans-serif; 
               }
               
               .contactform_login #User,
               .contactform_login #Pass{
                  
                    padding: 5px; 
                    color: #000000;
                    font: 1.0em/1.5em Arial, "Trebuchet MS", Verdana, sans-serif; 
               }

               #subm {
                    /* Versenden-Schaltfläche */
                    font: 1.1em/1.6em "Trebuchet MS", Verdana, sans-serif; 
                    width: 250px;
                    border: 1px solid #986C2B;
                    padding: 2px 5px 2px 5px;
                    color: #fff;
                    background-color: #986C2B;
                    margin-left: 50px;
                    font-weight: bold;
                    -moz-border-radius: 3px;
               }
               
               #subm_index {
                    /* Versenden-Schaltfläche */
                    font: 0.9em/1.4em "Trebuchet MS", Verdana, sans-serif; 
                    width: 227px;
                    border: 1px solid #986C2B;
                    padding: 2px 5px 2px 5px;
                    color: #fff;
                    background-color: #986C2B;
                    font-weight: bold;
                    -moz-border-radius: 3px;
               }
               #submit_board {
                    /* Versenden-Schaltfläche */
                    font: 0.9em/1.4em "Trebuchet MS", Verdana, sans-serif; 
                    width: 230px;
                    border: 2px solid #9c7233;
                    padding: 2px 5px 2px 5px;
                    margin-left: 130px;
                    color: #fff;
                    background-color: #986C2B;
                    font-weight: bold;
                    -moz-border-radius: 3px;
               }

               #go_button {
                    /* Versenden-Schaltfläche */
                    font: 11px "Helvetica, Trebuchet MS", sans-serif; 
                    width: 35px;

                    padding: 2px 5px 2px 5px;
                    border: 0px solid #986C2B;
                    color: #fff;
                    background-color: #9c7233;
                    font-weight: bold;

                    padding: 2px 5px 2px 5px;
               }

               /*  ICONS FÜR EINGABEFELDER   */

               .contactform #Name, .contactform_login #User {
                    background: #fff url(../images/forms/buddy.gif) no-repeat left;
               }
               .contactform_login #Pass {
                    background: #fff url(../images/forms/pass2.gif) no-repeat left;
               }
               .contactform #Email, .contactform #Email2 {
                    background: #fff url(../images/forms/email.gif) no-repeat left;
               }
               .contactform #newsletter {
                    padding: 0px 0px 0px 30px;
                    background: #fff url(../images/forms/email.gif) no-repeat left;
               }
               .contactform #Site {
                    background: #fff url(../images/forms/house.gif) no-repeat left;
               }
               .contactform #Feedback, #Betreff {
                    
                    background: #fff url(../images/forms/comment.gif) no-repeat bottom right; 
               }
               .contactform #Name,
               .contactform #Email,
               .contactform #Email2,
               .contactform #Site,
               .contactform_login #User,
               .contactform_login #Pass
               {
                    
                    padding: 5px 5px 5px 30px;
               }
               
               /* Hover-Zustände für jeweilige Eingabefelder */
              
               .contactform #Name:hover,
               .contactform #Email:hover,
               .contactform #Email2:hover,
               .contactform #Site:hover,
               .contactform #Feedback:hover,
               .contactform #Betreff:hover,
               .contactform #req:hover,
               .contactform #no_req:hover,
               .contactform_login #User:hover,
               .contactform_login #Pass:hover {
                    background-color: #E8933C;
                  /*  border: 4px solid #66aadd;
                    color: #333333; */
               }
               .contactform #preissuche:hover,
               .contactform #land:hover,
               .contactform #datum:hover,
               .contactform #newsletter:hover{
               background-color: #E8933C;
               }


               .contactform #preissuche:focus,
               .contactform #land:focus,
               .contactform #newsletter:focus,
               .contactform #datum:focus,
               .contactform #req:focus,
               .contactform #no_req:focus,
               .contactform_login #User:focus,
               .contactform_login #Pass:focus{
               background-color: #fff;
               }

               .contactform #Name:focus,
               .contactform #Email:focus,
               .contactform #Email2:focus,
               .contactform #Site:focus,
               .contactform #Betreff:focus,
               .contactform #Feedback:focus
               {
                  /*  border: 4px solid #77bbdd;
                    color: #fff; */
                    background-color: #fff;
               }
               
               .form_error {
               color: #FF0027;
               font-weight: bold;
               font-size: larger;
               }

               .contactform .wrong #Email, 
               .contactform .wrong #Email2, 
               .contactform_login .wrong #User, 
               .contactform_login .wrong #Pass {
                    /* Gestaltung der Felder mit Fehlermeldungen */
                    background: #FFF7B4 url(../images/forms/warning.png) no-repeat left;
                    -moz-border-radius: 3px;
                    color: #333333;
                    border: 2px solid #FF0027;
               }
               
               .contactform .wrong #Name {
                    /* Gestaltung der Felder mit Fehlermeldungen */
                    background: #FFF7B4 url(../images/forms/warning.png) no-repeat left;
                    -moz-border-radius: 3px;
                    color: #333333;
                    border: 2px solid #FF0027;
               }
               
               .contactform .wrong #Feedback, .contactform .wrong #Betreff {
                    /* Gestaltung der Felder mit Fehlermeldungen */
                    background: #FFF7B4 url(../images/forms/warning.png) no-repeat bottom right;
                    -moz-border-radius: 3px;
                    color: #333333;
                    border:2px solid #FF0027;
               }
               /* wenn javascript unterdückt ist, diese fehlermeldung   */
               .newsletter_wrong{
                   font-family: Helvetica, Arial, Geneva, Swiss, SunSans-Regular;
                   font-size: 14px;
                   color: black;
                   border:2px;
                   background-image: url("../images/pages/bg_red_trans.png");
                   background-repeat: repeat;
                   border-color: #000000;
                   border-style: none;
                   padding: 4px;
                   margin: 12px;
                   position:absolute;
                   left:475px; top:350px; width:300px; height:50px;
                   z-index:1;
                   text-align: center;
                   text-transform: uppercase;
                }
                
               
               .newsletter_ok{
                   background: #fcfcfc url(../images/forms/accept.png) no-repeat left;
                   font-family: Helvetica, Arial, Geneva, Swiss, SunSans-Regular;
                   line-height: 18px;
                   font-size: 14px;
                   font-weight: 300;
                   color: #000000;
                   border:2px;
                   border-color: #419D4C;
                   border-style: solid;
                   border-width: 1px;
                   padding: 8px 4px 8px 4px;
                   margin: 12px;
                   position:absolute;
                   left:485px; top:365px; width:300px; height:auto;
                   z-index:1;
                   text-align: center;
                    -moz-border-radius: 3px;
                    padding: 5px 5px 5px 30px;
                    background-color:#EEEE5A;
                }
                
               .newsletter_not_ok{
                   background: #fcfcfc url(../images/forms/warning.png) no-repeat left;
                   font-family: Helvetica, Arial, Geneva, Swiss, SunSans-Regular;
                   line-height: 18px;
                   font-size: 14px;
                   font-weight: 300;
                   color: #000000;
                   border:2px;
                   border-color: #E36652;
                   border-style: solid;
                   border-width: 1px;
                   padding: 8px 4px 8px 4px;
                   margin: 12px;
                   position:absolute;
                   left:485px; top:365px; width:300px; height:auto;
                   z-index:1;
                   text-align: center;
                    -moz-border-radius: 3px;
                    padding: 5px 5px 5px 30px;
                    background-color:#EEEE5A;
                }

                
             /*  div#board_sucscribe_ok{
                   font-family: Helvetica, Arial, Geneva, Swiss, SunSans-Regular;
                   line-height: 18px;
                   font-size: 14px;
                   font-weight: 300;
                   color: #000000;
                   border:2px;
                   background-color:#EEEE5A;
                   border-color: #000000;
                   border-style: solid;
                   padding: 20px;
                   position: relative;
                   left: 150px;
                   margin: 12px;
                   width:400px; 
                   height:90px;
                   text-align: center;
                }*/
                
               div#board_sucscribe_ok, div#form_report_ok{
                    background: #fcfcfc url(../images/forms/accept.png) no-repeat left;
                    line-height: 18px;
                    font-size: 14px;
                    border: 1px solid #419D4C;
                    padding: 10px 30px 10px 30px;
                    background-color:#EEEE5A;
                    width: 80%;
                    margin: 1.5em auto;
                    -moz-border-radius: 3px;
                    text-align: center;
                }
               div#form_report_wrong{
                    background: #fcfcfc url(../images/forms/warning.png) no-repeat left;
                    line-height: 18px;
                    font-size: 14px;
                    border: 1px solid #E36652;
                    padding: 10px 30px 10px 30px;
                    background-color:#EEEE5A;
                    width: 80%;
                    margin: 1.5em auto;
                    -moz-border-radius: 3px;
                    text-align: center;
                }
                
               .formlabel {
                   font-family: Helvetica, Arial, Geneva, Swiss, SunSans-Regular;
                   font-size: 10px;
                   color: black;
               }               
               .contactform #Erfolg {
                    /* Mitteilung: Informationen wurden versandt */
                    background: #fcfcfc url(../images/forms/accept.png) no-repeat left;
                    border: 1px solid #eeeeee;
                    color: #0066CC;
                    padding: 10px 10px 10px 30px;
                    -moz-border-radius: 3px;
                    width: 80%;
                    margin: 1.5em auto;
               }

/*  -------------------------------------------------------------
    3. GESTALTUNG VON EINGABEFELDERN IM OBJEKTE FORMULAR
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -   */

 .objektform{
  clear:both;
  padding-top: 20px;
  margin-left: -40px;
  padding-right: 1px;
  margin-bottom: 40px;
  width: 550px;
  
 }
 
 .imageform{

  padding-top: 20px;
  margin-left: -40px;
  padding-right: 1px;
  margin-bottom: 40px;
  width: 670px;
  
 }

               .objektform .contactleft {
                    /* Linker Bereich des Formulars: für Labels */
                    width: 120px;
                    clear: left;
                    float: left;
                    display: inline;
                    padding: 4px;
                    margin: 10px 0;
                    text-align: right;
               }
               .objektform .contactright {
                    /* Rechter Bereich des Formulars: für Eingabefelder */
                    text-align: left;
                    width: auto;
                    float: left;
                    display: inline;
                    padding: 4px;
                    margin: 5px 0;
               }
               
               .objektform .formdescription {
                    /* Linker Bereich des Formulars: für Labels */
                    width: 200px;
                    clear: right;
                    float: right;
                    display: inline;
                    padding: 4px;
                    margin-top: -8px;
                    text-align: left;
               }    
               
               .objektform input,
               .objektform textarea,
               .objektform select {
                  
                    padding: 4px; 
                    color: #000000;
                    font: 1.0em/1.5em Arial, "Helvetica, Trebuchet MS", Verdana, sans-serif; 
               }

               /* Hover-Zustände für jeweilige Eingabefelder */
              
               .objektform input:hover,
               .objektform textarea:hover,
               .objektform select:hover {
                    background-color: #E8933C;
                  /*  border: 4px solid #66aadd;
                    color: #333333; */
               }


               .objektform input:focus,
               .objektform textarea:focus,
               .objektform select:focus {
               background-color: #fff;
               }

               .objektform .wrong/*,
               .objektform .wrong input,
               .objektform textarea .wrong,
               .objektform select .wrong*/ {
                    /* Gestaltung der Felder mit Fehlermeldungen */
                    background: #FFF7B4 url(../images/forms/warning.png) no-repeat left;
                    -moz-border-radius: 3px;
                    color: #333333;
                    border: 2px solid #FF0027;
                    padding: 5px 5px 5px 30px;
               }
/*  -------------------------------------------------------------
    4. ALLGEMEINE ATTRIBUTE
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -   */
            /*   h2 { */
                    /* Überschrift der Seite */
                   /*  font-family: "Trebuchet MS", Calibri, Georgia,serif;
                    font-weight: normal;
                    font-size: 4em; 
                    color: #fff;
               }*/
               span.required {
                    /* Markierung des Eingabefeldes, das ausgefüllt werden soll */
                    color: #fff;
                    font-size: 2em;
               }
               label {
                    /* Beschriftung des Eingabeldes */
                    color: #fafafa;
                                        font: 9px "Helvetica, Trebuchet MS", sans-serif;
                    font-weight: 600;
                    padding: 2px 5px 2px 5px;
                    /* Hintergrundfarbe + Abrundung */
                    background-color: #9c7233;
                    
                    -moz-border-radius: 3px;
               }
               
               .newsletterlabel {
                    /* Beschriftung des Eingabeldes */
                    color: #fafafa;
                    font-weight: 600;
                    padding: 2px 5px 2px 5px;
                    font-size: 12px;
                    /* Hintergrundfarbe + Abrundung */
                    background-color: #9c7233;
                    
                    -moz-border-radius: 3px;
               }
               
/*  -------------------------------------------------------------
    admin part
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -   */
               .wrong #mail_ok {
                    /* Gestaltung der Felder mit Fehlermeldungen */
                    background: #FFF7B4;
                    -moz-border-radius: 3px;
                    color: #000000;
                    border:2px solid #1edb4d;
               }
               
               