/*.rel-dialog { z-index: 100; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.2); }*/
.rel-dialog { z-index: 100; position: fixed; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.2); }
div[data-draggable="true"] { position: relative; margin-left: auto; margin-right: auto; -moz-box-shadow: 0 0 20px #232323; -webkit-box-shadow: 0 0 20px #232323; box-shadow: 0 0 20px #232323; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.dragMe { background-color: transparent; }
.rel-popup { position: fixed !important; bottom: 0; right: 0; overflow: auto; }
.ui-title { z-index: 9; border: 1px solid #4CAF50; background-color: #4CAF50; -moz-border-radius: 5px 5px 0px 0px; -webkit-border-radius: 5px 5px 0px 0px; border-radius: 5px 5px 0px 0px; font-size: 13pt; text-align: left; color: #fff; padding: 5px; text-transform: capitalize; font-weight: 600; cursor: move; }
	.ui-title > span { float: right; cursor: pointer; padding: 2px 10px 0px 10px; }
.ui-body { display: block; background-color: #fff; padding: 5px 20px 10px 3px; max-height: 600px; overflow-y: auto; }
.ui-footer { background-color: #fff; -moz-border-radius: 0px 0px 5px 5px; -webkit-border-radius: 0px 0px 5px 5px; border-radius: 0px 0px 5px 5px; padding: 5px 0px 15px 0px; text-align: right; display: table; width: 100%; }
.rel-popup button[data-icon="Preview"], button[data-icon="Preview"] { background-color: #20b2aa; }
.rel-popup button[data-icon="Preview"]:focus, button[data-icon="Preview"]:focus { background-color: #f5f5f5;color:#20b2aa; border: 2px solid #20b2aa; font-weight:600;}
.rel-popup button[data-icon="Delete"], button[data-icon="Delete"] { background-color: #ef5858; }
.rel-popup button[data-icon="Delete"]:focus, button[data-icon="Delete"]:focus { background-color: #f5f5f5;color:#ef5858; border: 2px solid #ef5858; font-weight:600; }
.rel-popup button[data-icon="Save"], button[data-icon="Save"], .rel-popup button[data-icon="Add"], button[data-icon="Add"], .rel-popup button[data-icon="Modify"], button[data-icon="Modify"] { background-color: #4CAF50; }
.rel-popup button[data-icon="Save"]:focus, button[data-icon="Save"]:focus, .rel-popup button[data-icon="Add"]:focus, button[data-icon="Add"]:focus, .rel-popup button[data-icon="Modify"]:focus, button[data-icon="Modify"]:focus { background-color: #f5f5f5;color:#4CAF50; border: 2px solid #4CAF50; font-weight:600; }
.rel-popup button[data-icon="Close"], button[data-icon="Close"] { background-color: #abad22; }
.rel-popup button[data-icon="Close"]:focus, button[data-icon="Close"]:focus { background-color: #f5f5f5;color:#abad22;  border: 2px solid #abad22; font-weight:600;}
.rel-popup button { margin-right: 5px; }
.close-dialog { z-index: 10; position: absolute; /* border: 1px solid; */ padding: 3px 7px; font-size: 1.5em; top: 0.1em; right: 0.1em; color: #f5f5f5; cursor: pointer; }
.FormBtnDiv { width: 96.2%; height: 30px; }
.txtOption:hover { -webkit-transform: scale3d(1, 1, 1); -moz-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); -o-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); opacity: 1; filter: alpha(opacity=100); }

.txtOption { position: relative; float: left; text-indent: 0%; height: 35px; width: 35px; cursor: pointer; margin-right: 10px; }
	.txtOption i { color: inherit; text-decoration: none; font-size: 1.3em; position: relative; }
	.txtOption::before { left: 0; top: 0; content: ""; position: absolute; width: 100%; height: 100%; -webkit-transform: scale3d(0, 0, 0); -moz-transform: scale3d(0, 0, 0); -ms-transform: scale3d(0, 0, 0); -o-transform: scale3d(0, 0, 0); transform: scale3d(0, 0, 0); -webkit-transition: all; -o-transition: all; -moz-transition: all; transition: all; -webkit-transition-duration: 250ms; -moz-transition-duration: 250ms; -o-transition-duration: 250ms; transition-duration: 250ms; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; backface-visibility: hidden; background-color: rgba(0, 0, 0, 0.12); z-index: 0; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; opacity: 0; filter: alpha(opacity=0); }
	.txtOption:hover::before { -webkit-transform: scale3d(1, 1, 1); -moz-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); -o-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); opacity: 1; filter: alpha(opacity=100); }
.divoptions { width: 200px; height: 0px; position: absolute; background-color: #fff; border: 0px 0px 10px rgba(255,93,7,0.5); -moz-box-shadow: 0px 0px 2px rgba(255,93,7,0.5); -webkit-box-shadow: 0px 0px 2px rgba(255,93,7,0.5); box-shadow: 0px 0px 2px rgba(255,93,7,0.5); -moz-transition: all 250ms ease-in-out; -o-transition: all 250ms ease-in-out; -webkit-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out; opacity: 0; z-index: -1; left: 65%; top: 60%; overflow-x: hidden; overflow-y: hidden; }
.optionAnimate { height: auto; -moz-transition: height 250ms ease-in-out; -o-transition: height 250ms ease-in-out; -webkit-transition: height 250ms ease-in-out; transition: height 250ms ease-in-out; opacity: 1; z-index: 5; }
.liOptions { width: 98.5%; height: 40px; -moz-box-shadow: 0 0 1px rgba(0,0,0,0.5); -webkit-box-shadow: 0 0 1px rgba(0,0,0,0.5); box-shadow: 0 0 1px rgba(0,0,0,0.5); color: #777; margin: 1px; list-style-type: none; }
	.liOptions:hover { background-color: rgba(218,218,218,0.5); cursor: pointer; }
.anchOptions { display: table-cell; padding: 8px 0px 0px 2px; font-size: 14px; float: left; cursor: pointer; text-decoration: none; color: #777; }

 button[data-icon="GetData"] {
    background-color: #6495ED;
}/* added by praveen sen 23-Apr-2018*/