
.dialog-mask {
    -moz-border-radius:5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background:url("/static/images/custom-dialog-bg.png") repeat scroll left top transparent;
    z-index: -1;
    position: absolute;
    top:-5px;
    left:-5px;
	-webkit-transform: translateZ(0);
}

.dialog-mask2 {
    border-radius: 0;
    border-bottom-left-radius: 5;
    border-bottom-right-radius: 5;
    background-color: White;
    z-index: -1;
    position: absolute;
    top:35px;
    left:0;	
	-webkit-transform: translateZ(0);
}

body .ui-dialog .dialog-titlebar 
{
    border-radius: 0;
    border-top-left-radius: 5;
    border-top-right-radius: 5;    
    color: White;
    font-family: arial;
    font-size: 12px;
    background: none;
    border: none;  
    /* padding: 0; */  
    /* add block so that it can width */
}

.ui-dialog .ui-dialog-title {
	float: left;
	margin: 0.3em 16px 0.3em 0;
	white-space: nowrap;
	width: 90%;
	overflow: hidden;
	text-overflow: ellipsis;
}
.dialog-footer 
{
    margin: 0;
    border: none;
    background: #EAEAEA;
}

body .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
    font-family: arial;
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    float: none;
}

.wizarddialog-footer 
{    
    -moz-border-radius-bottomleft: 5px;
    -moz-border-radius-bottomright: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5;
    border-bottom-right-radius: 5;
    background-color: #EAEAEA;
    height: 40px;       
    position: absolute;
	bottom: 0;
	right: 0;
	left: 0;
	padding: 5px 10px 5px 10px;
	margin: 0;	
}

.wizarddialog-footer input {
	/* styles for button */	
	padding: 5px 0 5px 0;	
	margin: 4px 5px 0 5px;
	text-decoration: none;
	font-weight: bold;	
	text-align: center;
	width: 100px;	
	
	font-family: Arial;
	font-size: 12px;
	background-color: #666666;
    border: solid 1px #4D4D4D; 
	color: White;
	
	/* css3 implementation :) */
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	/*-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	text-shadow: 0 -1px 1px rgba(0,0,0,0.25);*/
	border-bottom: 1px solid rgba(0,0,0,0.25);	
	
	cursor: pointer;	
}

.wizarddialog-footer input:hover 
{
    background-color: #91c946;
    border: solid 1px #004813; 
	color: #004813;
	text-decoration: none;	
}

.wizarddialog-button-right {
	/* styles for button */			
	float: right;	
}

.wizarddialog-button-left {
	/* styles for button */		
	float: left;		
	/* override margin to give the left button some space on left */
	margin: 0.5em 0.4em 0.5em 0.5em !important;
}

.wizarddialog-left 
{
    position: absolute;
    top: 0;   
    left: 0;
    bottom: 0;
    background-color: #f8f8f7; 
    padding: 0;   
    margin: 0;
    color: #666666;   
    width: 140px;    
}

.wizarddialog-left p 
{
    text-align: center;
    margin: 8px 0 4px 0;
}

.wizarddialog-left ul 
{       
    margin: 19px 0 0 0;
    padding: 0;
}

.wizarddialog-left ul li 
{
    display: block;    
    width: 100%;
    text-align: center;
    padding: 5px 0 0 0;
    margin: 0;
    min-height: 25px;
    line-height: 1.6em;
    font-weight: bold; 
    border: solid 1px #f8f8f7;    
}

.wizarddialog-left ul li:hover
{
    background-color: #91c946; 
    border: solid 1px #91c946;   
	color: #004813;
    cursor: pointer;
}	

.wizarddialog-left .active-step 
{
    background-color: White;    
    color: #004813;
    border: solid 1px #91c946;
}

.printLayoutImage 
{
    padding: 1px;
    border: solid 1px #f8f8f7;  
    margin: 5px 0 0 8px;
}

.printLayoutImage_active 
{
    padding: 1px;
    border: solid 1px #91c946;  
    margin: 5px 0 0 8px;  
}

.drag {
	position: absolute;
	border: solid 1px #EAEAEA;
	background-color: White;
	padding: 0;
	cursor: move;
	z-index: 8000;			
	}
	
#printcontainment-wrapper  
{
    width: 100%; 
    height: 500px;       
}	

.wizarddialog-right 
{
    position: relative;
    margin: 0 0 0 150px;
}

.style-main-tab 
{
  /* height: 96% !important; */
  border: none !important;  
  /* background-color: white !important;   */
}
  
.style-top-tab 
{
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-radius: 0 !important;
}

.dialog-footer button, .ui-dialog-buttonset button {
    background: #666666 !important;
    color: White !important;
    border-color: #4D4D4D !important;
}

.dialog-footer button:hover{
    background: #91c946 !important;
    border-color: #004813 !important;
}

.wizarddialog .ui-dialog-buttonset
{
    /* force next and previous buttons to be on left and right */
    width: 100%;
}

.wizarddialog .ui-dialog-buttonset button {
    width: 100px;
}

/* fix for close button background of white in dialog */
.ui-dialog-titlebar .ui-button {
    background: 0 none transparent;
    border: 0;

}
.ui-dialog-titlebar .ui-button:hover {
    background-color: #d3e7bc;
    border: inherit;
}
/* end fix */


/* style for dock window
 * corresponds to .ui-dialog .ui-dialog-titlebar-close */
/* I need to move the dialog buttons into a container instead of positioning each one separately */
body .ui-dialog .dlg_button {
	position: absolute;
	right: 2em;
	top: 50%;
	width: 19px;
	margin: -10px 0 0 0;
	height: 18px;
	padding: 1px;
	border: 0;
	background: 0 none transparent;
}

body .ui-dialog .dock_button {
	right: 2em;
}

body .ui-dialog .trans_button {
	right: 4em;
}

body .ui-dialog .rollup_button {
	right: 6em;
}

/* versions with close button removed. also assumes no dock button */
body .ui-dialog .trans_button_noclose {
    right: 0;
}

body .ui-dialog .rollup_button_noclose {
    right: 2em;
}

body .ui-dialog .dlg_button.hover {
	background-color: #d3e7bc;
}

/* fixes change in opacity when dialog dragging is disabled */
.Im_the_dock .dock_dialog .ui-state-disabled {
    background-image: none;
    opacity: 1;
}

.Im_the_dock  {
	overflow: hidden;
	white-space: nowrap;
}

.Im_the_dock .dock_dialog {
	display: inline-block;
	position: relative;
	vertical-align: top;
	overflow: auto;
}


/* Remove absolute positioning */
.Im_the_dock .dock_dialog .ui-dialog {
	position: relative !important;
	left: 5px !important;
	top: 5px !important;
}

