/* dialog css styles =  */


/* Default styling used when javascript does not transform dialog into rounded border style. */
.error-balloon-cbb
{
  margin:1em 0;
  padding:0 10px;
}

.error-balloon-cbb h1
{
  margin:0 -10px;
  padding:0.3em 10px;
  background:#f7f7f4;
  font:bold 1.2em/1 Arial, Helvetica, sans-serif;
}

/* After dialog has been transformed into new layout with rounded borders */
.error-balloon-cb{ margin:0.5em 0; }


/* Top corners and border */

.error-balloon-bt
{
  height:17px;
  margin:0 0 0 11px;
  background:url(/images/dialog/error-box.gif) no-repeat 100% 0;  
}

.error-balloon-bt div
{
  position:relative;
  left:-11px;
  width:12px;
  height:17px;
  background:url(/images/dialog/error-box.gif) no-repeat 0 0;
  font-size:0;
  line-height:0;
}

/* Bottom corners and border */

.error-balloon-bb
{
  height:14px;
  margin:0 0 0 12px;
  background:url(/images/dialog/error-box.gif) no-repeat 100% 100%; 
}

.error-balloon-bb div
{
  position:relative;
  left:-12px;
  width:12px;
  height:14px;
  background:url(/images/dialog/error-box.gif) no-repeat 0 100%;
  font-size:0;
  line-height:0;
}

/* Left border */
.error-balloon-i1
{
  padding:0 0 0 4px;
  background:url(/images/dialog/error-borders.gif) repeat-y 0 0;
}

            
/* Right border */
.error-balloon-i2
{
  padding:0 4px 0 0;
  background:url(/images/dialog/error-borders.gif) repeat-y 100% 0;  
}


/* Wrapper for the content. Use it to set the background colour and insert some padding between the borders and the content. */

.error-balloon-i3
{
  display:block;
  margin:0;
  padding: 0 10px 10px 10px;
  background:#f7f7f4;
}

/* Make the content wrapper auto clearing so it will contain floats (see http://positioniseverything.net/easyclearing.html). */

.error-balloon-i3:after 
{
  content:"."; 
  display:block; 
  height:0; 
  clear:both; 
  visibility:hidden;
}

.error-balloon-i3 { display:inline-block; }

.error-balloon-i3 { display:block; }

.error-balloon-arrow
{
  position : absolute;
  float : left;
  padding:0;
  margin:0;
  margin-top : 22px;
  width : 50px;
  /*left : 180px;*/
}

#error-message-dialog .overlay-content{
  background : #f7f7f4;
  border:0;
}

/******************************************************************************/
/* FORM Error Styles */

#error-message{
  background-color : #dfe1e0;
  border-top : solid 4px #425e75;
  border-bottom : solid 1px #8097aa;
}

#form-wrp .form-element-error strong.label {
  color : red;
}

#form-wrp .form-element-error select, #form-wrp .form-element-error input, #form-wrp .form-element-error textarea{
  border : solid 1px red;
  background-color:#fee
}

#form-wrp .error-text, #form-wrp .success-text {
  font-weight:bold;
}

#form-wrp .error-text {
  color : red;
}

#form-wrp .success-text {
  font-weight:bold;
  color : green;
}



/******************************************************************************/
/* ERROR MESSAGING                                                            */

div#error-wrp {
  background-color:#dfe1e0;
  border-bottom:1px solid #8097aa;
  padding:5px 10px;
  margin:0 0 10px 0;
  color:#666;
  clear: both;
}

div#error-explanation h3 {
  color:#f00;
  margin:0;
  padding:0;
  font-size:12px;
}

div#error-explanation ul {
  padding-left:25px;
  margin:0;
}

div#error-explanation ul li {
  font-weight:bold;
  padding:2px 0;
}

div#error-explanation p {
  margin-top:5px;
}

div#error-message-dialog {
  width:100%;
  display:none;
  padding:0;
  margin:0;
}