.leftpane { width: 50%; margin: 0; padding: 0; float: left; }
.rightpane { width: 50%; margin: 0; padding: 0; float: right; }
.push { clear: both; }

/* ############################## FANCYBUTTON

  Uses a single sprite for 4-state sliding doors style buttons
  Usage:
  
  <A HREF="#" CLASS=fancybutton><div>Label</div><span></span></A>
*/


a.fancybutton {
  height: 30px;
  display: block;
  margin-left: 15px;
  background-position: 20px 0px;
  cursor: pointer;

  font-family: trebuchet ms, helvetica, verdana, arial;
  font-size: 15px;
  line-height: 19px;
  font-weight: bold;
  text-decoration: none;
  color: black;
  outline: none;
  
  text-shadow: #FFF 0px 1px 1px;
}

a.fancybutton > div {
  padding: 4px 0px 0px 20px;
  float: left;
  display: block;
  height: 26px;
  background-image:url(images/sliding_buttons.png);
  background-position: -20px 0px;
}

a.fancybutton > span {
  float: left;
  display: block;
  height: 30px;
  width: 20px;
  background-position: 0px 0px; 
  background-image:url(images/sliding_buttons.png); 
}

a.fancybutton:hover > div {  background-position: -20px -30px; color: black; }
a.fancybutton:hover > span { background-position: 0px -30px;   }

a.fancybutton:focus > div {  background-position: -20px -90px; }
a.fancybutton:focus > span { background-position: 0px -90px;   }

a.fancybutton.fancydefault > div {  background-position: -20px -90px; }
a.fancybutton.fancydefault > span { background-position: 0px -90px;   }

a.fancybutton:active > div {  background-position: -20px -60px;  padding-top: 6px; height: 24px; }
a.fancybutton:active > span { background-position: 0px -60px;   }

/* #################################### FACEBOX 

  Hacked to use a single sprite with blended shadow borders
*/

#facebox { 
  position: fixed; 
  top: 0; left: 0;
  z-index: 100;
  text-align: left;
}
#facebox .popup { position: relative; }

#facebox table { border-collapse: collapse; }

#facebox td {
  background:url(facebox/c_big2.png);
  border-bottom: 0;
  padding: 0;
}

#facebox .l { background-position: 0px -80px; }
#facebox .r { background-position: 20px -80px; }
#facebox .b {  background-position: 0px -20px; }
#facebox .tl { background-position: 0px -40px; }
#facebox .tr { background-position: -20px -40px; }
#facebox .bl { background-position: 0px -60px; }
#facebox .br { background-position: -20px -60px; }

#facebox .body {
  padding: 0px;
  background: #fff;
}

#facebox .loading {
  text-align: center;
}

#facebox .tl, #facebox .tr, #facebox .bl, #facebox .br {
  height: 20px;
  width: 20px;
  overflow: hidden;
  padding: 0;
}

#facebox_overlay {
  position: fixed;
  top: 0px;
  left: 0px;
  height:100%;
  width:100%;
}

.facebox_hide {
  z-index:-100;
}

.facebox_overlayBG {
  opacity: 0;
  background-color: #222;
  z-index: 99;
}

.facebox_loading {
  position: fixed;
  width: 104px;
  height: 69px;
  left: 50%;
  background-position: 0px 0px;
  background-image: url(images/gears_sprite3.png);
}

* html #facebox_overlay { /* ie6 hack */
  position: absolute;
  height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

#facebox .facebox_title
{
line-height: 20px; 
font-size: 20px;
margin: 0px;
margin-bottom: 10px;
text-shadow: #DDD 2px 2px 2px;
}

#facebox .facebox_content {
  padding: 0px;
  padding-top: 0px;
}

/* Kizi Facebox */

#facebox .facebox_content > h2 {
  color: black;
  margin: 0px;
  padding: 6px 17px 5px 12px;
  background-color: #eee;
  border-bottom: 1px solid #ccc;
  text-shadow: #FFF 0px 1px 1px;
}

#facebox .formbody {
  padding: 11px 15px 0px 15px;
}

#facebox .facebox_footer {
  padding: 11px;
  height: 31px;
}

#facebox .fieldWrapper { margin-bottom: 4px;  color: black; }

#facebox .fieldWrapper label { display: block; float: left; width: 110px; margin-right: -110px; text-align: right; 
  font-size: 13px; line-height: 19px; vertical-align: middle; }
  
#facebox .fieldWrapper input, #facebox .fieldWrapper select, #facebox .fieldWrapper textarea { 
background-color: #e5e5e5;
border-top: 1px solid #555; border-left: 1px solid #555; border-right: 1px solid #999; border-bottom: 1px solid #999;
margin-left: 120px; 
padding: 2px 4px;
width: 464px;
margin-bottom: 4px;
color: black;
}

#facebox .fieldWrapper input:focus, #facebox .fieldWrapper select:focus, #facebox .fieldWrapper textarea:focus {

  background-color: #eee;
  border: 1px solid black;
}

/* EMAIL FORM */

.emailform > p {
margin: 0px;
margin-bottom: 10px;
}

.emailform > p > label {
float: left;
width: 170px;
margin-right: -170px;
text-align: right;
font-size: 90%;
padding-top: 4px;
}

.emailform > p > input[type=text],  .emailform > p > input[type="password"],
.emailform > p > textarea, .emailform > p > select {
width: 230px;
margin-left: 180px;
background-color: #eee;
padding: 4px;
border: 1px solid #555;
}

.emailform > p > textarea, .emailform > p > input, .emailform > p > select {
font-family: "Myriad Pro", Verdana,Helvetica,sans-serif;
font-size: 14px;
}

.emailform input[type=text]:focus, .emailform select:focus, .emailform textarea:focus,
.emailform input[type=password]:focus
  { background-color: #FFC;}

.emailform > p > select { width: 240px; }

.emailform input[type=checkbox] { margin-left: 180px; margin-top: 8px;}

.emailform input[type=submit] { margin-left: 180px; }

ul.errorlist { margin-left: 165px; color: #A00; font-weight: bold; list-style: none; background: url('images/required_arrow.png') no-repeat 24px -2px; height: 12px; }
ul.errorlist > li { margin: 12px; line-height: 6px; }


ul.errorlist + p input,  ul.errorlist + p textarea, ul.errorlist + p select { border: 1px solid red; }

/* EDIT LINKS */

A.editlink { font-weight: normal; font-size: 11px; font-family: verdana, tahoma, helvetica, sans-serif; color: #c100e4;
  padding: 2px 5px; margin: 0px 4px; background-color: #eee; border: 1px dotted #777; text-decoration: none;  }

A.editlink:hover { color: #e138ff; background-color: white; }
A.editlink:active { background-color: black; color: white; border: 1px solid black; }
A.editlink:focus { border: 1px solid black; outline: 0px; }

hr { border: none; border-bottom: 1px solid black; width: 80%; margin: 16px auto; }