input[type=text], input[type=password], select {
   /* it looks like the default width is 150px */
   padding: 3px;
   width:200px;
}

.zend_form dt{
   display: block;
   /* clear: left;  */
   float: left;
   margin-bottom: 15px;
   width: 120px; 
 }
 .zend_form dd {
   margin-bottom: 15px;
 }
 
#article-form .zend_form dt{
	float: none;
    width: 100%;
} 

dt label.required:after {
	content: " *";
	color: #ff0000;
}

.flat-button {
   background-color:#AAAAAA;
   color:#FFFFFF;
   font-size:138.5%;  
   padding:10px 20px;
   font-weight: bold;
   border: none;
}
.flat-button-hover {
   background-color: #ccc !important;  
}

.flat-button-small {
   padding:10px;
}

 ul.errors li{
   list-style-type: disc;     
   color: red;
 }
 
 .error-title {
   color: red;
 }


/* why using span?
 * bc if you apply the padding to the container div
 * it will show in the layout. However
 * no style is on the container div then 
 * it will be invisible
 */ 

#ajax-loader span {
   z-index: 10000;
   font-weight: bold; 
   background-color: #FFFF00;
   padding: 4px 10px;
 } 
 
/* Hides from IE-mac \*/
    * html  #ajax-loader span {
        position: absolute; 
        top: expression(( 0 +(ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop)) + '%'); right: expression(( 50 + (ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft document.body.scrollLeft)) + '%');
    }
/* End hide from IE-mac */ 
 
#ajax-loader > span {
   position: fixed;
   top: 0%; 
   right: 50%; 
 }
 
 
 #flash-message {
   border:1px solid #ffe222;
   background-color:#fff8cc;
   padding:10px;
   width:250px;
   margin: 15px auto;
   font-size: 15px;
   font-weight: bold;
   text-align: center;
   color: #000;
 }
 
/*  .button {
   margin:20px 0;    
}
.button a{
   background-color:#AAAAAA;
   color:#FFFFFF;
   font-size:138.5%;  
   padding:10px 20px;
   text-decoration: none;
   font-weight: bold;
}
.button a:hover {
  background-color: #ccc;
} */