/* see https://jsfiddle.net/jddevight/Lm6vz8cb/ */
.ui-dialogstack .ui-dialog-content {
	position: relative;
	border: 0;
	padding: .5em 1em;
	background: none;
	overflow: auto;
	zoom: 1;
	background-color: #ffd;
	border: solid 1px #ea7;
}

.ui-dialogstack .ui-dialog-titlebar {
	display: none;
	
}
.ui-state-default .ui-icon {
	background-image: none;
}

.ui-widgetstack-content {
	border: none;
}

.ui-dialog .ui-dialog-content {
	position: relative;
	border: 0;
	padding: .5em 1em;
	background: none;
	overflow: auto;
	zoom: 1;
	background-color: /*ffd*/ #fff;
	border: 6px solid #f7941d; /* orange */
	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
	border-radius: 9px;
	color: #222;
	padding: 0 2%;
	font-size: .9em;
	-webkit-box-shadow: 4px 4px 4px #444;
	-moz-box-shadow: 4px 4px 4px #444;
	box-shadow: 4px 4px 4px #444;
}
.ui-button-icon-only {
	position: relative;
	overflow: visible;
}
	.ui-button-icon-only .ui-icon {
		position: absolute;
		top: -0.5em;
		left: -1.5em;
		width: 2em;
		height: 2em;
	}

.ui-dialog .ui-dialog-title {
	float: left;
	margin: .1em 0;
	font-size: 0.9em;
	font-weight: 600;
	white-space:  normal;
	width: 90%;
	/*text-overflow: ellipsis;*/
}
.ui-widget-content {
	border: none;
}
.ui-dialog-titlebar {
	display: none
}
/*.ui-dialog .ui-dialog-titlebar-close {
	position: absolute;
	background: url("assets/x-close.png");
	position: absolute;
	right: .3em;
	top: 50%;
	width: 20px;
	margin: -10px 0 0 0;
	padding: 1px;
	height: 20px;
}*/

.ui-icon-closethick {
	background-image: url(assets/x-close.png) !important;
	background-position: left top !important;
	margin: 0 !important;
}

/*.ui-dialog .ui-dialog-titlebar-close, .ui-icon-closethick {
	width: 20px !important;
	height:20px !important;
}*/

.ui-dialog .ui-dialog-titlebar-close {
	background: none !important;
	border: none !important;
}

	.ui-dialog .ui-dialog-titlebar-close, .ui-dialog .ui-dialog-titlebar-close:hover {
		padding: 0 !important;
	}
/*
According to the UI dialog documentation, the dialog plugin generates something like this:
<div class="ui-dialog ui-widget ui-widget-content ui-corner-all ui-draggable ui-resizable">
   <div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix">
	  <span id="ui-dialog-title-dialog" class="ui-dialog-title">Dialog title</span>
	  <a class="ui-dialog-titlebar-close ui-corner-all" href="#"><span class="ui-icon ui-icon-closethick">close</span></a>
   </div>
   <div class="ui-dialog-content ui-widget-content" id="dialog_style1">
	  <p>One content</p>
   </div>
</div>
That means what you can add to any class to exactly to first or second dialog using jQuery's closest() method. For example:

$('#dialog_style1').closest('.ui-dialog').addClass('dialog_style1');
$('#dialog_style2').closest('.ui-dialog').addClass('dialog_style2');
*/

#pfclose {
	position: absolute;
	top: -0.5em;
	right: -0.5em;
	width: 2em;
	height: 2em;
}