body {
  background-color:#F7F3F7;
  font-family:Verdana;
  font-size:1em; 
  color: #474747;
}

#registration-form .layoutBox {
  padding:7px;
  width:623px !important;
  background-color:#FFFFFF;
  border: 1px solid #D8D8D8;
}


/*inschrijving*/
#registration-form {
  position:absolute;
  left:50%;
  margin: 50px 0 0 -310px;
  font-size:70%; 
}

    #registration-form .head a {
      display:block;  
    }
  
    #registration-form #personalInformation #stepBox {
      position:relative;
      margin:0 0 25px 0;
      height:50px;
      border:1px solid #E4E0E0;  
    }
  
    #registration-form #personalInformation #stepBox img {
      position:absolute; z-index:2;
      cursor:pointer; 
    }
    
      #registration-form #personalInformation #stepBox img,
      #registration-form #personalInformation #stepBox .stepName {
        position:absolute; z-index:2;
        font-weight:bold;  
      }
      
      #registration-form #personalInformation #stepBox #firstStep {left:10px;}
      #registration-form #personalInformation #stepBox #firstImgStep {left:20px; top:18px;}
      #registration-form #personalInformation #stepBox #secondStep {left:160px;} 
      #registration-form #personalInformation #stepBox #secondImgStep {left:200px; top:18px;}
      #registration-form #personalInformation #stepBox #thirdStep {left:350px;}
      #registration-form #personalInformation #stepBox #thirdImgStep {left:370px; top:18px;}
      
      #registration-form #personalInformation #stepBox .connection {
        position:absolute; z-index:1;
        left:42px; top:30px;
        width:340px;
        display:block;
        border-top:1px dashed #B6B4B4;
      }

        
    #registration-form #personalInformation h2 {
      margin:0 0 5px 5px;
      color:#000; 
      font-size:100%
    }
  
    #registration-form #personalInformation p{
      margin:0 0 20px 5px;
    }
    
    #registration-form #personalInformation .legenda{
      display:none;
      margin:0 0 20px 35px;
    }
    
      #registration-form #personalInformation .legenda span{
        display:block;
        padding: 0 0 0 30px;
        background-repeat:no-repeat;
        background-position: 0 50%;     
      }
    
      #registration-form #personalInformation #publicButton{background-image:url("/_img/new-user/public.gif");}
      #registration-form #personalInformation #friendButton{background-image:url("/_img/new-user/friends.gif");}
      #registration-form #personalInformation #privateButton{background-image:url("/_img/new-user/private.gif");}
  
    #registration-form #profielgegevens { 
      margin:0 0 10px 5px;
      padding-bottom:10px;
      width:98%;
      border-bottom:1px solid #E4E0E0;
    }
    
      #registration-form #profielgegevens .head {
        position:relative;
        height:21px;
        color:#000;
        font-weight:bold;
        background-image:url("/_img/bg-bar.gif");
        border:1px solid;
        border-color: #E4E0E0 #FFFFFF #E4E0E0 #FFFFFF;
        vertical-align:middle;
      }
      
        #registration-form #profielgegevens .head #sec1,
        #registration-form #profielgegevens .head #sec2,
        #registration-form #profielgegevens .head #sec3 {
          display:none;
          position:absolute;
          top:3px;
          padding: 0 0 0 30px;
          width:22px;
          background-repeat:no-repeat;
          background-position: 0 50%;
        }
      
        #registration-form #profielgegevens .head #sec1 {
          left:513px;
          background-image:url("/_img/new-user/public.gif");  
        }

        #registration-form #profielgegevens .head #sec2 {
          left:547px;
          background-image:url("/_img/new-user/friends.gif");  
        }

        #registration-form #profielgegevens .head #sec3 {
          left:581px;
          background-image:url("/_img/new-user/private.gif");  
        }

      #registration-form #profielgegevens .name {
        width:25%;
        vertical-align:top;
      }
      
        #registration-form #profielgegevens th .extraInfo{
          display:inline-block;
          background-image:url("/_img/extra-info.gif");
          background-repeat:no-repeat;
          width:11px; height:11px;
        }
        
        .gecko #registration-form #profielgegevens th .extraInfo{
          display:-moz-inline-box;
        }
      
      #registration-form #profielgegevens .inputvalues {
        width:60%;
        padding:2px 5px 2px 5px;
        vertical-align:top;
      }
      
      #registration-form #profielgegevens .compulsory {
        padding-right:10px;
        width:2%;
        font-size:140%;
        color:#000;
        font-weight:bold;
        vertical-align:middle;
      }
      
      #registration-form #profielgegevens .errorPlaceHolder {
        width:150px;
        padding:2px 5px 2px 5px;
      }

      .gecko #registration-form #profielgegevens .errorPlaceHolder img {
        vertical-align: middle;
      }
      
      #registration-form #profielgegevens .buttonHolder {
        text-align:right;
      }
      
      #registration-form #profielgegevens .security {
        display:none;
        width:40px !important;
      }
    

#registration-form .error {
  color:#000;  
}

#registration-form .waiting {
  width:16px; height:16px; 
}


/*iframe*/
#form-validator-frame {
  visibility:hidden;
  height:1px; width:1px;
}


/*specific settings*/
#registration-form #profielgegevens #gebruikersnaam,
#registration-form #profielgegevens #email,
#registration-form #profielgegevens #wachtwoord,
#registration-form #profielgegevens #wachtwoord2 {
 width:150px; 
}

#registration-form #profielgegevens #voornaam,
#registration-form #profielgegevens #achternaam,
#registration-form #profielgegevens #straatnaam,
#registration-form #profielgegevens #plaatsnaam {
 width:250px;  
}

#registration-form #profielgegevens #postcode,
#registration-form #profielgegevens #geboortedatum {
  width:75px;  
}

#registration-form #profielgegevens .rowDivider {
  margin-left:80px;  
}

.none{
  display:none;  
}

/*step 3*/
#registration-form #leukeVragen { 
  margin:0 0 10px 5px;
  padding-bottom:10px;
  width:98%;
  border-bottom:1px solid #E4E0E0;
}
    
#registration-form #leukeVragen .head {
  position:relative;
  height:21px;
  color:#000;
  font-weight:bold;
  background-image:url("/_img/bg-bar.gif");
  border:1px solid;
  border-color: #E4E0E0 #FFFFFF #E4E0E0 #FFFFFF;
  vertical-align:middle;
}
      
#registration-form #leukeVragen .name {
  width:25%;
  vertical-align:top;
}


#registration-form #leukeVragen .inputvalues {
  width:60%;
  padding:2px 5px 2px 5px;
  vertical-align:top;
}

#leukeVragen .inputField {
  width:15em;  
}

#registration-form #leukeVragen .buttonHolder {
  text-align:right;
}

/*emailvalidatie pagina*/
#emailvalidation-form {
  position:absolute;
  left:50%;
  margin: 50px 0 0 -310px;
  font-size:70%;
}

  #emailvalidation-form .layoutBox {
    padding:7px;
    width:623px !important;
    background-color:#FFFFFF;
    border: 1px solid #D8D8D8;
  }

  #emailvalidation-form .head{
    height:122px;
  }

  #emailvalidation-form #headImage {
    display:inline-block;
    position:relative;
    width:495px; height:122px;
    background-color:#FE6905;
    float:left;
  }
  
    #emailvalidation-form #headImage span {
      position:absolute;
      left:5px; bottom:5px;
      font-size:200%;
      color:#FFFFFF;
    }
  
  #emailvalidation-form #headLogo {
    margin-left:5px;
    float:left;
  }

  #emailvalidation-form h2 {
    margin:0 0 5px 5px;
    color:#000; 
    font-size:100%
  }

  #emailvalidation-form p{
    margin:0 0 20px 5px;
  }