/* Live Bid Online CSS Document */
/*
 * Author: John Vander Reest
 * Updated: 22/09/2008
 */



/* ELEMENTS */
body {
  font-family: Arial, Helvetica;
  /* background-color: #eeefff; */
}

h2 {
  width: 33%;
}

div {
  overflow: hidden;
  clip: rect(auto,auto,auto,auto);
}



/*
 * CLASSES
 */
.invisible{
  position: absolute;
  width: 0px;
  height: 00px;
}

.spacer{
  clear: left;
}

.label{
  position: relative;
  float: left;
  text-align: left;
  font-weight: normal;
  color: #666;
  margin: 1px 1px 1px 1px;
}

.value{
  position: relative;
  float: left;
  text-align: left;
  font-size: 18px;
  color: #666;
}

.frame{
  border: solid #d3d7da 1px;
  padding: 4px 4px 6px 8px;
}


/*
 * LED: Colours
 */
.ledblue{
  border: solid #009 3px;
  background-color: #09f;
}

.ledgreen{
  border: solid #360 3px;
  background-color: #9f3;
}

.ledorange{
  border: solid #f63 3px;
  background-color: #fc0;
}

.ledpurple{
  border: solid #808 3px;
  background-color: #c3c;
}

.ledred{
  border: solid #900 3px;
  background-color: #d00;
}

.active {
  color: green;
  font-weight: bold;
}

.inactive {
  color: red;
  font-weight: bold;
}

.buttonenabled{
  color: maroon;
}

.buttondisabled{
  color: #666;
}

.bidhistory {
  position: relative;
  float: left;
  width: 200px;
  height: 295px;
  font-size: 11px;
  text-align: left;
  color: black;
  font-family: Courier New;
  background-color: #fff;
  border: #fff 1px solid;
}

#tabcontrol{
  position: relative;
  float: left;
  font-size: 12px;
  text-align: left;
  margin: 2px 0px 0px 1px;
  padding: 0px 0px 0px 0px;
}

.tabinactive{
  background-color: #aaa;
  border: #f0f0f0 1px solid;
  cursor: pointer;
  color: #333;
  float: left;
  height: 17px;
  margin: 0px 1px 0px 0px;
  padding: 5px 2px 2px 10px;
  position: relative;
  width: 112px;
}  

.tabinactive:hover{
/*
  border: #00F 1px solid;
  background-color: #dde;
  font-weight: bold;
*/
  background-color: #bbc;
  color: #339;
}

.tabactive{
  background-color: #dde;
  border: #00F 1px solid;
  color: #03f;
  cursor: pointer;
  float: left;
  font-weight: bold;
  height: 17px;
  margin: 0px 1px 0px 0px;
  padding: 5px 2px 2px 10px;
  position: relative;
  width: 113px;
}

/*
.box{
  border: solid #adf 1px;
}
*/


/*
 * FIELDS
 */
#product{
  float: left;
  font-size: 18px;
  color: #fff;
}

#login{
  float: right;
  font-size: 14px;
  color: #fff;
  padding-right:20px;
}

#cla_logo{
  font-size: 27px;
  color: white;
}
#live_logo{
  font-size: 26px;
  background-color: #fff;
  color: #248;
}

#led{
  position: relative;
  width: 25px;
  height: 10px;
  float: right;
  font-size: 8px;
}

#userstatus{
  margin: 5px 0px 0px 10px;
}

#lotheading{
  position: relative;
  clear: left;
  text-align: left;
  font-weight: normal;
}
/*


#lotimage{
  color: #ddd;
  font-weight: bold;
  font-size: 72px;
  height: 272px;
  float: left;
  margin: 0px;
  padding: 0px;
  position: relative;
  text-align: center;
  width: 254px;
}


*/

#lotimage{
  color: #ddd;
  font-weight: bold;
  font-size: 72px;
  height: 272px;
  left: 0px;
  margin: 0px;
  padding: 0px;
  position: relative;
  text-align: center;
  top: 0px;
  width: 254px;
}

#bidstatus{
  position: relative;
  width: 163px;
  float: left;
  text-align: left;
  font-weight: bold;
  color: #339;
}

#country{
  position: relative;
  width: 163px;
  float: left;
  clear: left;
  text-align: left;
  font-weight: normal;
}
#labeleventid{
  position: relative;
  float: left;
  font-size: 14px;
  text-align: left;
  font-weight: normal;
}
#eventid{
  position: relative;
  float: left;
  font-size: 14px;
  text-align: left;
  font-weight: bold;
  color: #666;
}
#labellotid{
  position: relative;
  color: #666;
  float: left;
  font-size: 20px;
  text-align: left;
  font-weight: normal;
}
#lotid{
  position: relative;
  color: blue;
  float: left;
  font-size: 20px;
  text-align: left;
  font-weight: bold;
  width: 215px;
}
#buttonbid{
  width: 185px;
  height: 30px;
  font-size: 20px;
  margin: 5px 0px 5px 0px;
  padding: 0px 0px 5px 0px;
}

/* obsolete */
#submit{
  width: 175px;
  height: 30px;
  font-size: 20px;
  color: maroon;
  margin: 5px 10px 5px 10px;
/*  border: solid #adf 1px; */
}


/*
 * MY PURCHASES

#purchases{
  background-color: #ccc;
  height: 272px;
  float: left;
  margin: 0px;
  padding: 0px;
  position: relative;
  width: 254px;
}

#purchases{
  top: 155px;
  left: 78px;
  width: 255px;
  background-color: #ccc;
  position: absolute;
  padding: 0px;
  margin: 0px;
}

*/

#purchases{
  background-color: #ccc;
  height: 272px;
  left: 0px;
  margin: 0px;
  padding: 0px;
  position: relative;
  top: 0px;
  width: 254px;
}

#realized{
  height: 268px;
  width: 250px;
  border: none;
  background-color: #f0f0f0;
  padding: 2px;
  margin: 0px;
  overflow: auto;
}


/*
 * LAYOUT
 */
#screen{
  border: solid #eee 0px;
  position: relative;
  width: 900px;
  height:600px;
}

#caption{
  top: 0px;
  left: 0px;
  height: 30px;
  color: #8af;
  /* background-color: #248;  */
  padding: 0px;
  margin: 0px 0px 3px 0px;
}

#client{
  height: 500px;
  position: relative;
  background-color: white;
  border: solid #d3d7da 1px;
  padding: 4px 4px 6px 8px;
}

#intro{
  position: absolute;
  top: 33px;
  left: 0px;
  width: 900px;
  height: 600px;
  border: solid #009 0px;
  background-color: #fff;
}

#logo{
  width: 58px;
  height: 60px;
  font-weight: bold;
  background-color: #248;
  float: left;
}

#status{
  position: relative;
  border: solid #ccc 1px;
  width: 254px;
  height: 60px;
  float: left;
  margin: 0px 0px 0px 10px;
  font-size: 12px;
  text-align: left;
}
#message{
  position: relative;
  border: solid #ccc 1px;
  width: 546px;
  height: 60px;
  float: left;
  margin: 0px 0px 0px 10px;
  overflow: auto;
  font-size: 12px;
  text-align: left;
}

#gutter{
  width: 58px;
  height: 400px;
  float: left;
  margin: 10px 0px 0px 0px;
  vertical-align: middle;
}


/*
 * HEADERS
 */
#header2{
  width: 255px;
  height: 40px;
  float: left;
  margin: 10px 0px 0px 10px;
}

#header1{
  width: 325px;
  height: 40px;
  float: left;
  margin: 10px 0px 0px 10px;
}

#header3{
  width: 165px;
  height: 40px;
  float: left;
  margin: 10px 0px 0px 10px;
}

#header4{
  width: 30px;
  height: 40px;
  float: left;
  margin: 10px 0px 0px 10px;
}


/*
 * SECTIONS
 */
#section1{
  border: solid #ccc 1px;
  width: 256px;
  height: 300px;
  float: left;
  margin: 3px 0px 0px 8px;
}

#lotdescription{
  width: 324px;
  height: 300px;
  float: left;
  margin: 5px 0px 0px 10px;

  text-align: left;
  font-size:14px;
  overflow: scroll;
}

#bidhistory{
  width: 205px;
  height: 300px;
  float: left;
  margin: 5px 0px 0px 10px;
}


/*
 * INFO
 */
#info1{
  width: 240px;
  height: 20px;
  float: left;
  margin: 10px 0px 0px 10px;
  padding: 0px 0px 0px 10px;
}

#info2{
  width: 320px;
  height: 20px;
  float: left;
  margin: 10px 0px 0px 10px;
  padding: 0px 0px 0px 10px;
}

#info3{
  width: 195px;
  height: 20px;
  float: left;
  margin: 10px 0px 0px 10px;
  padding: 0px 0px 0px 10px;
}


/*
 * FOOTERS
 */
#footer1{
  width: 240px;
  height: 28px;
  float: left;
  color: #090;
  text-align: left;
  font-size: 14px;
  margin: 5px 0px 0px 10px;
  padding: 12px 0px 0px 10px;
}

#footer2{
  width: 330px;
  height: 30px;
  float: left;
  color: #f66;
  font-weight: bold;
  text-align: right;
  margin: 5px 0px 0px 10px;
  padding: 10px 0px 0px 0px;
}

#footer3{
  width: 205px;
  height: 40px;
  float: left;
  margin: 5px 0px 0px 10px;
}


/*
 * ADVICE
 */
#advicelabel{
  width: 150px;
  color: #999;
  float: left;
  font-size: 12px;
  text-align: left;
}

#advicevalue{
  width: 50px;
  color: #999;
  float: left;
  font-size: 12px;
  text-align: left;
}

#advice1{
  width: 170px;
  color: #999;
  float: left;
  font-size: 12px;
}

#advice2{
  width: 170px;
  color: #999;
  float: left;
  font-size: 12px;
}

#advice3{
  width: 170px;
  color: #999;
  float: left;
  font-size: 12px;
}