/*global -------------------------------------*/

div#page {
    width:705px; 
    padding: 0px 4px 0px 5px;
    position:absolute;
    left: 50%;
    margin-left: -357px; /*set to a negative number 1/2 of your width*/
}
h1 {
    font-size: 150%;
    font-weight: bold;
    padding: 5px 10px 0px 0px;
    margin: 0px;
    width: 450px;
}
h2 {    
    border-top: 1px solid #c6c8ca;
    background-position: 0px -15px;
    background-image:  url(../images/eyetraking/topmenu_bg.gif);
    background-repeat: repeat-x;
    padding: 3px 5px 10px 8px;
    font-size: 120%;
    margin: 5px 0px 5px -5px;
}
h4 {
    font-size: 110%;
    margin: 0px 0px 5px 0px;
}
p.subtitle {
    margin: -10px 0px 15px 0px;
}
.highlight {
    font-weight: bold;
    color: #0b9956;
}
.error img {
    vertical-align: middle;
}
.error span {
    padding-left: 3px;
}

/*forms -------------------------------------*/

div#formcontent {
    margin: 10px 10px 10px 15px;
}
div#formcontent label {
    display: block;
}
.errorlabel {
    color: #b00404;
    font-weight: bold;
    padding: 3px 0px;
}
.errortext {
    color: #b00404;
    margin: -5px 0px 10px 0px;
}
.errorfield {
    border: 2px solid #b00404;
}
div#formcontent p {
    margin: 15px 0px;
}
div#formcontent input,  div#formcontent select {
    margin-bottom: 3px;
    vertical-align: middle;
}
div#formcontent td {
    white-space: nowrap;
    padding: 3px 4px;
    vertical-align: middle;
}
div#formcontent p.helptext {
    margin: -5px 0px 10px 0px;
    color: #9e9c9e;
}
.helptext {
    color: #888888;
    font-size: 90%;
    padding: 0px;
    margin: 0px 0px 10px 0px;
}
.formright {
    float: left;
    padding-right: 15px;
}
.formaction {
    border-top: 1px solid #c6c8ca;
    background-position: top;
    background-image:  url(../images/eyetraking/topmenu_bg.gif);
    background-repeat: repeat-x;
    padding: 0px 5px 60px 10px;
    margin: 25px 0px 30px 0px;
}

.button, .buttoninactive {
    margin:0;
    padding:10px 0 0 0;
    list-style:none;
    font-weight: bold; 
      }
.button li {
      float:left;
      background:url("../images/eyetraking/button_left.gif") no-repeat left top;
      margin:0;
      padding:0 0 0 3px;
      }
.button a:link, .button a:visited {
      display:block;
      background:url("../images/eyetraking/button_right.gif") no-repeat right top;
      padding: 8px 14px 8px 10px;
    color: #242724;
    text-decoration: none;
}
.button a:hover {
    color: #000000;
}
.buttoninactive li {
      float:left;
      background:url("../images/eyetraking/button_ina_left.gif") no-repeat left top;
      margin:0;
      padding:0 0 0 3px;
      }
.buttoninactive a:link, .buttoninactive a:visited {
      display:block;
      background:url("../images/eyetraking/button_ina_right.gif") no-repeat right top;
      padding: 8px 14px 8px 10px;
    color: #242724;
    text-decoration: none;
}
.secondaryaction {
    margin-top: 7px;
    padding-left: 140px;
    color: #666666;
}
.secondaryaction a {
    margin-left: 4px;
}
.secondbutton {
    margin-top: -10px;
    padding-left: 83px;    
}
.rightalign  ul{
    float: right;
}


/*status -------------------------------------*/

.field div.l, .field td.l {
    background:url(../images/eyetraking/ajax-loader.gif) no-repeat left;
    height:16px;
    padding-left:20px;
    margin-left:5px;
}

.field div.s, .field td.s {
    background:url(../images/eyetraking/success_image.gif) no-repeat left;
    height:16px;
    padding-left:20px;
    margin-left:5px;
}

.field div.f, .field td.f {
    background:url(../images/eyetraking/error_image.gif) no-repeat left;
    height:16px;
    padding-left:20px;
    margin-left:5px;
    color:#d12427;
}

.field .status {
    padding:0px 0px 0px 0px;
    margin-top: 0px;
}

.field input,
.field select {
    float:left;
    border: 1px solid #bdbdbd;
    height: 14px;
}

label.f {
    color:#d12427;
}

input.f {
    border:2px solid #d12427;
}


.field TD {
    height: 26px;
}


.br {
    overflow:hidden;
    height:0px;
    width:0px;
    clear:both;
}

#pg-error {
    display:none;
}

.meter {
    background:#ebebe8;
    height:16px;
    border:1px solid #b4b6b8;
    width:150px;
    margin-top:-4px;
}

.meter .mark {
    border-right:1px solid #fff;
    text-align:center;
    height:14px;
    padding-top:2px;
    width:49px;
    float:left;
}

.meter #m3.mark {
    border-right:0px;
}

#strength-password label {
    float:left;
    padding-right:5px;
}