﻿.nw-table {
    border-spacing: 0px;
    border-collapse: collapse;
}

.nw-loading-image {
    vertical-align: central;
    text-align: center;
    width: 24px;
    height: 24px;
    background-image: url("data:image/gif;base64,R0lGODlhGAAYAIAAAFLOQv///yH/C05FVFNDQVBFMi4wAwEAAAAh+QQFCgABACwOAAAABAAEAAACBQxgp5dRACH5BAUKAAEALBQABgAEAAQAAAIFDGCnl1EAIfkEBQoAAQAsFAAOAAQABAAAAgUMYKeXUQAh+QQFCgABACwOABQABAAEAAACBQxgp5dRACH5BAUKAAEALAYAFAAEAAQAAAIFDGCnl1EAIfkEBQoAAQAsAAAOAAQABAAAAgUMYKeXUQAh+QQFCgABACwAAAYABAAEAAACBQxgp5dRACH5BAkKAAEALAAAAAAYABgAAAIdjB8AyN2qnGRwzZss3rz7D4biSJbmiabqyrbuOxYAIfkECQoAAQAsAAAAABgAGAAAAjaMHwDI3aqcZHDNmyzevO/oGVEVVqRHgqUWtu4LU2w3Qqs5Y2n+8fH/yKkuJ5FNdzQOJ8uMowAAIfkECQoAAQAsAAAAABgAGAAAAjKMHwDI3aqcZHDNmyzevO/oUVCIVGSpnerKth4YRuZbjbScdrDLP3nGmRmEEyKx+NsdCgAh+QQJCgABACwAAAAAEgAYAAACKowfAMit2mJ6MsKKsz53v+VR2zSW5olKnfaNrQum8rkatS3i96vHyL4oAAAh+QQJCgABACwAAAAACgAYAAACIIwfAHiqnByMs84H3WL6bguGIoJxklmS38iqXmp02VIAACH5BAkKAAEALAAAAAAKABIAAAIajB8AeKqcHIyzzgfdYvpuC4YignGSWZIfUgAAIfkECQoAAQAsAAAAAAoACgAAAhGMHwB4qpwcjLPOB91i+m5WAAAh+QQJCgABACwGAAAABAAEAAACBQxgp5dRADs=");
}

.nw-selected {
    background-color: #e6f2fb;
      -ms-filter: "progid:DXImageTransform.Microsoft.gradient(enabled=false)" !important;
    position: relative; /* resetting the filter back to normal doesnt work in ie8 mode unless position relative is set */
   
}

.nw-disabled
{
     -moz-opacity:.50; 
     filter:alpha(opacity=50); 
     opacity:.50;
     cursor: default;
}

.nw-confirmation-buttons
{
    text-align: right;
}


.rootDivContainer
{
    overflow: scroll;
    height: 600px;
    width: 950px;
    padding-bottom: 20px;
    background-color: #fff;
    overflow-y: scroll;
    overflow-x: hidden;
}

.dialogStyle
{
    overflow: scroll;
}



.ui-dialog-titlebar
{
    padding-bottom:  20px;
}

.nicEdit-main
{
    background-color: #fff;
    height: 100px;
}

img.nw-toolbox-img
{
    width: 30px;
    height: 30px;
    cursor: pointer;
}

#rulesListScrollArea ul, #uiToolboxHeader, .nf-toolbox-categories ul
{
    list-style: none;
    padding: 0px;
    margin-left: 0px;
}

.nw-selector
{
    min-width: 50px;
    height: 22px;
    border-width: 1px;
    border-style: solid;
    border-color: #828790;
}

.nw-input-textbox
{
    border-color: #828790;
    border-width: 1px;
    border-style: solid;
    background-color: #fff;
    padding-left: 4px;

}

.nw-input-dropdown
{
    height: 22px; 
    font-family: segoe ui, Arial, sans-serif; 
    border:  1px solid  #828790;
    min-width: 50px;
    background-color: #fff;
}

.nw-textArea
{
    border-color: #828790;
    border-width: 1px;
    border-style: solid;
    background-color: #fff;
}

.nw-dropdown
{
    width: 339px;
}

.nw-action-title
{
    margin-left: 125px;
    position: absolute;
    margin-top: 7px;
    font-weight: normal;
}

.nw-rte-container
{
    padding-left: 10px;
    border-top-color: #d8d8d8;
    border-top-style: solid;
    border-top-width: 1px;
    padding-top: 8px;
}

.welcome-screen-header
{
    height: 15px;
	color: #e69700;
	font-weight: bold;
	background-attachment: scroll;
	background-repeat: repeat-x;
	background-size: auto;
	background-origin: padding-box;
	background-clip: border-box;
	background-color: #21374c;
    border-radius:0px;
    background-position: 50% 50%;
}

    .welcome-screen-header a
    {
        right: 5px;
        position: absolute;
    }
   
.metro-welcome 
{
    font-family:Segoe UI Light,Segoe UI,Segoe,Tahoma,Helvetica,Arial,sans-serif;
    line-height:1em;
    font-size:2.77em;
    white-space:nowrap;
    color:#0072c6;
  
}

.metro-welcome_desc 
{
    font-family:Segoe UI Light,Segoe UI,Segoe,Tahoma,Helvetica,Arial,sans-serif;
    font-size:1.06em;
    white-space:nowrap;
    color:#666;
}

.metro-tile-section
{
    position:inherit; 
    height:150px;
    width:100%;
}
 .metro-tile
  {
      height:150px;
      width:150px;
      position:absolute;
      display:inline;
      
  }
  
  .metro-tile-inner-top
  {
      height:150px;
      width:150px;
      position:absolute;
      bottom:0;
      background-position:center;
      cursor:pointer;
      text-decoration:none !important;
  }
  
  .metro-tile-inner-bottom 
  {
      height:40px;
      width:142px;
      min-height:40px;
      /*opacity:0.7;*/
      position:absolute;
      bottom:0;
      padding:4px;
      text-align:center;
      color:#fff !important;
      /*z-index:10;*/
      text-decoration:none !important;
      background-color:  rgba(0, 0, 0, 0.5);
      font-size: 1.1em;
  }

.tile-description
{
    position: absolute;
    margin-top: 25px;
    text-align: left;
    font-size: 0.9em;
}

.welcomeScr-terms-header
{
        font-size:0.9em; 
        color:#666666;
        margin-top:20px;
        position: absolute;
}

    .welcomeScr-terms-header a
    {
        /*text-decoration:none !important;*/
        color:inherit;
    }
 
        .welcomeScr-terms-header a:visited
        {
            color:inherit;
        }
    
#uiDivWelcomeScreen
{
    margin-top: 20px;
}

.nw-Dialog-Table
{
    width: 98%;
    margin-top: 30px;
    border-top-color: #d8d8d8;
    border-top-style: solid;
    border-top-width: 1px;
    margin-left: auto;
	margin-right: auto;
    padding-bottom: 10px;
    padding-top: 5px;
}

.nw-Dialog-BottomButtonTable
{
    width: 98%;
    margin-top: 30px;
    margin-left: 8px;
    padding-bottom: 10px;
}

.nw-button
{
    min-width: 0px;
    height: 20px;
    padding-top: 0px;
}

.nw-createItem-Delete
{
    float: right;
    padding-top: 5px;
}

.nw-table-header
{
    text-align: left;
    min-height: 30px;
    color: rgb(60,60,60);
    border-bottom: 1px solid rgb(165,165,165);
    font-weight: bold;
    font-size: 10pt;
    
    background-color: #d8d8d8;
}


#rulesWarning {
    font-size: 9pt;
    min-height: 40px;
    position: absolute;
    top: 0px;
    background-color: white;
}

.nf-rules-header-text {
    height: 30px;
    padding-left: 2px;
    padding-right: 2px;
    padding-top: 3px;
    visibility: inherit;
}

html[dir="rtl"] .nf-rules-header-text {
    float: right;
}

.nf-rule-warning-text {
    cursor: none;
    font-size: 10pt;
    padding-bottom: 3px;
    padding-left: 6px;
    padding-right: 5px;
    padding-top: 3px;
}

html[dir="ltr"] #ruleWarning {
    float: right;
}

html[dir="rtl"] #ruleWarning {
    float: left;
}

.nf-rule-warning-icon {
    padding: 5px;
}

th.nw-table-header-command
{
    text-align: center;
}

th.nw-table-cell
{
    text-align: left;    
}

td.nw-table-cell-select
{
    margin-top: 2px;
}

td.nw-table-cell-command
{
    text-align: center;
    cursor: pointer;
    vertical-align: middle;
    padding-left: 2px;
    padding-right: 2px;
}

td.nw-table-cell-yes
{
    color: rgb(0, 153, 0);
}

td.nw-table-cell-no
{
    color: rgb(255, 0, 0);
}

tr.nw-table-cell
{
    height: 30px;
    font-size: 10pt;  
}

.nf-rule-item.nf-rules-drag-placeholder:hover
{

    border: 1px dashed #f1c43f !important;
    background: rgb(253, 238, 179) !important;
    
}

.nf-rule-item-right-section {
    height: 100%;
}


.nf-rule-item:active
{
    outline: 1px solid #F9ECB7;
    background: #F9ECB7; /* for non-css3 browsers */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F9ECB7', endColorstr='#F9ECB7'); /* for IE D2CEAA*/
    background: -webkit-gradient(linear, left top, left bottom, from(#FFDB6B), to(#F9ECB7)); /* for webkit browsers */
    background: -moz-linear-gradient(top,  #FFDB6B,  #F9ECB7); /* for firefox 3.6+ */
    
}

td.nw-table-cell-primary 
{
     
}

.nw-input-textbox-variable
{
   
    height: 18px;
    width: 197px;
    
}

.nw-input-textbox-variable:hover 
{
     border-color: rgb(156, 206, 240);
}

.div-nwVariableInfo
{
    height: 500px;
    overflow-y: auto;
    overflow-x: hidden;
}

.div-nwModifyVariable
{
   position: absolute;
   bottom: 10px;
   width: 100%;
   text-align: right;
}

/* hide the close button on some dialogs */
.no-close .ui-dialog-titlebar-close {display: none } 

INPUT:hover
{
    border-color: rgba(156, 206, 240, 0.5);
}

.datePicker-testArea
{
    border-color: #828790;
    border-width: 1px;
    border-style: solid;
    background-color: white;
    height: 15px;
    width: 140px;
    vertical-align: top;
}

.builder-button
{
  height: 25px;
  min-width: 25px !important;
  vertical-align: middle;
  text-align: center;
}


.nf-rules-drag-handle
{

    width: 16px;
    height: 16px;
    background: url("/_layouts/15/NintexForms/images/icon_mover.png") no-repeat;
    cursor: pointer;
    z-index: 2001;
}


.nf-rules-disable {
    filter: Alpha(Opacity=70);
    opacity: 0.7;
    cursor: default !important;

}

.nf-rules-disable td
{

    background: transparent !important;
    
    border: 1px solid transparent;
}

.nf-add-new-rule td
{

    background: transparent !important;
    color: black;
    border: 1px solid transparent;
}

.nf-add-new-rule:hover td
{
    filter: Alpha(Opacity=100);
    opacity: 1.0;
    cursor: pointer; 
    
    color: rgb(40, 40, 40);
    background: #F9ECB7; /* for non-css3 browsers */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F9ECB7', endColorstr='#FFDB6B') !important; /* for IE D2CEAA*/
    background: -webkit-gradient(linear, left top, left bottom, from(#F9ECB7), to(#FFDB6B)); /* for webkit browsers */
    background: -moz-linear-gradient(top,  #F9ECB7,  #FFDB6B); /* for firefox 3.6+ */
}

.nf-add-new-rule:hover 
{

    filter: Alpha(Opacity=100);
    opacity: 1.0;
    outline: 1px solid rgb(299, 173, 99);
}


.nf-add-new-rule-icon
{
    filter: Alpha(Opacity=100) !important;
    opacity: 1.0;
    cursor: hand;
}

.nf-add-new-rule-icon-disabled
{
    filter: Alpha(Opacity=70) !important;
    opacity: 0.7;
    cursor: none;
}

.nf-rules-drag-placeholder 
{
    margin-left: 2px !important;
    margin-right: 2px !important;
    margin-top: 2px !important;
    margin-bottom: 2px !important;
    border: 1px dashed #f1c43f !important;
    background: rgb(253, 238, 179) !important;
    filter: Alpha(Opacity=100);
    opacity: 1.0;
  
    height:27px;
 
    

}

.nf-rules-drag-placeholder td
{
    
}

.nf-toolbar-divider {
    border-left: 1px solid rgb(220, 220, 220);
    width: 3px;
    padding-top: 5px;
    padding-bottom: 5px;

}

.nf-all-rules-span-inner {
    float: left;
    padding-top: 4px;
}

html[dir="rtl"] .nf-all-rules-span-inner {
    float: right;
}

.nf-add-new-rule-span {
    float: left;
    padding-top: 4px;
    padding-bottom: 2px;
    padding-left: 4px;
    margin-left: auto;
    margin-right: auto;
    width: 50%;
    cursor: pointer;
}

html[dir="rtl"] .nf-add-new-rule-span {
    float: right;
}

.nf-all-rules-span {
    float: right;
    padding-top: 2px;
    padding-bottom: 2px;
    width: 50%;
}

.nf-all-rules-checkbox {
    margin-bottom: 4px;
}

.nf-all-rules-checkbox-label {
    padding-top: 5px;
    padding-left: 5px;
    padding-bottom: 5px;
    color: black;
    white-space: nowrap;
}

.nf-add-new-rule-text {
    padding-right: 5px;
    padding-bottom: 3px;
    padding-top: 2px;
}

.nf-add-new-rule-table 
{
    padding-top: 4px;
    padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 4px;
    
}

.nf-rules-toolbar {
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.nf-rules-toolbar > div {
    box-sizing: border-box;    
    width: 50%;
}

.nf-rules-toolbar div {
    vertical-align: middle;
}

.nf-add-new-rule-table-disabled 
{
    filter:alpha(opacity=20) !important; 
    opacity:.20 !important;
    cursor: pointer;
}

.nf-rules-linked-tooltip {
    border-top: 1px solid black;
    width: 100%;
    height: 20px;
    padding-top: 3px;
    font-size: 10pt;
    color: black;
    padding-left: 30px;
    background-image: url("/_LAYOUTS/NintexForms/themes/base/images/linkedbase.png");
    background-position: 5px 8px;
    background-repeat: no-repeat;
}

#rulesValidationMessageInput, #ruleTypeDiv {
    border-bottom-color: #828790;
    border-top-color:  #828790;
    border-right-color: #828790;
    border-left-color: #828790;
}

#uiRulesList {
    bottom: 355px;
    overflow-x: hidden;
    overflow-y: auto;
    position: absolute;
    top: 59px;
    width: 100%;
    outline: none;
}

#uiRulesList > li {
    margin-left: 4px;
    margin-right: 4px;
}

#uiRulesList > li:first-child {
    margin-top: 4px;
}

.nf-rules-icon-showOnHover {
    display: none !important;
}

.nf-rule-item {
    font-size: 10pt;
    height: 27px;
    margin-top: 1px;
    outline: 1px solid rgb(210, 210, 210);
}

.nf-rule-item-orphan {
    filter: alpha(opacity=60) !important;
    opactiy: 0.60 !important;
}

    .nf-rule-item-orphan div {
        filter: alpha(opacity=60) !important;
        opactiy: 0.60 !important;
    }

.nf-rules-edit-section-warning {
    min-height: 35px;
    width: 100%;
    max-height: 35px;
    overflow: hidden;
    position: absolute;
    bottom: 270px;    
}

.nf-rules-item-cell 
{
    display:table-cell;
    text-align: center; 
    position: relative; /* resetting the filter back to normal doesnt work in ie8 mode unless position relative is set */
    
}

.nf-rules-item-cell-name 
{
    float: left;
    padding-top: 7px;
    padding-bottom: 2px;
    max-width: 140px;
    max-height: 15px;
    overflow: hidden;
    color: rgb(40,40,40);
    text-align: left;
   
}

html[dir="rtl"] .nf-rules-item-cell-name {
    float: right;
}

.nf-rules-item-cell-name-edit
{
    float: left;
    padding-top: 4px;
    padding-bottom: 0px;
    padding-left: 8px;
}

.nf-rules-item-command-group 
{
    display:table-cell;
    float: right;
    padding-top: 7px;  
    padding-right: 2px;
}

html[dir="rtl"] .nf-rules-item-command-group 
{    
    float: left;
}

.nf-rules-float-left 
{
    display:table-cell;
    padding-top: 7px;                        
    float: left !important;
    padding-left: 1px;
    padding-right: 2px;
}

html[dir="rtl"] .nf-rules-float-left
{
    float: right !important;
}

.nf-rules-item-command 
{
    text-align: center;
    cursor: pointer;    
    padding-left: 2px;
    padding-right: 2px;
}

.nf-rules-item-command-info
{
    text-align: center;
}

.nf-rule-hidden {
    display: none;
}

.nf-info-show-all-rules {
    font-size: 10pt;
    padding:5px;
}

.nf-rules-edit-area {
    background-color: rgba(239, 239, 239, 0.78);
    border-top: 1px solid rgb(165, 165, 165);
    bottom: 0px;
    padding-top: 2px;
    position: absolute;
    width: 100%;
}


.nf-rules-checkbox
{
    padding-left: 4px;
}

.nf-rules-checkbox-label
{
    min-width: 30px;
    font-size: 10pt;
    padding-left: 4px;
    color: rgb(80,80,80)
}


.nf-rules-checkboxes-div 
{
    padding-top: 4px;
    overflow: hidden;
    padding-left: 20px;
    padding-bottom: 4px;
}

.nf-rules-checkbox-div {
    float: left;
    padding-right: 40px;
    font-size: 10pt;
    font-weight: bold;
}

html[dir="rtl"] .nf-rules-checkbox-div {
    float: right;
}

.nf-rules-major-heading 
{
    font-size: 10pt;
    padding-left: 4px;
    padding-top: 4px;
    padding-bottom: 4px;
    font-weight: bold;
}

.nf-rules-information 
{
    font-size: 8pt;
    padding-top: 4px;
    font-weight: normal;
}

.nf-rules-edit-section {
    color: rgb(80, 80, 80);
    margin-bottom: 2px;
    padding-bottom: 5px;
}

.nf-rules-edit-validationsection {
    color: rgb(80, 80, 80);
    margin-bottom: 6px;
}

.nf-rules-ruletypediv-select {
    width: 200px;
}

.nf-rule-item:hover {
    background: #F2F9F3;
    outline: 1px solid #C0E0F5;
}
.nf-rule-item-selected {
    background: #97D5FC; /* for non-css3 browsers */
    background: -moz-linear-gradient(top, #D8F0FE, #97D5FC); /* for firefox 3.6+ */
    border: none;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D8F0FE', endColorstr='#97D5FC'); /* for IE D2CEAA*/
    outline: 1px solid #A3CCE5 !important;
}

.nf-rules-condition-label {
    font-size: 10pt;
    padding:5px;
}

.nf-rules-name {
    padding-bottom: 4px;
    padding-right: 4px;
    padding-left: 4px;
}

.nf-rules-validationmessage {
    padding-right: 4px;
    padding-left: 4px;

 }

.nf-rules-chevron-divider {
    border-right: 1px solid rgb(220, 220, 220);
    padding-left: 2px;
    float: right;
}

.nf-rules-chevron {
    cursor: pointer;    
    float: right;
}

.nf-rules-chevron-ie7 {
    padding-right: 5px;
}

.nf-rules-placeholder {
    min-height: 5px;
}

.nf-rules-placeholder-top {
    min-height: 5px !important;
}

.nf-rules-tooltip-div {
    padding: 5px;
}

.nf-rules-tooltip-body {
    max-heigth: 500px;
    overflow: scroll;
}

.nf-rules-tooltip-body-small {
    max-heigth: 250px;
    overflow: scroll; 
}

.nf-rules-tooltip-icon {

    background-image: url("/_LAYOUTS/NintexForms/themes/base/images/linkedbase.png");
    background-position: right center;

    background-repeat: no-repeat;
   
}

.nf-rules-context-menu {
    z-index: 6000;
}

.ui-icon-bold {
    background-image: url("/_layouts/NintexForms/images/NF_16x16_FormatMap.png") !important;
    left: 0px;
    top: -64px;
    width: 16px;
    height:16px;
    background-position: 0px -64px;
}

.ui-autocomplete-input 
{
    width: 80px;
}

.ui-autocomplete {
		
		overflow-y: scroll;
		/* prevent horizontal scrollbar */
		overflow-x: hidden;
		/* add padding to account for vertical scrollbar  */
		padding-right: 20px;
}

.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl {
    border-bottom-left-radius: 4px;
}

.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl {
    border-top-left-radius: 4px;
}


.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr {
    border-top-right-radius: 4px;
}

.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {
       filter: Alpha(Opacity=100);
    opacity: 1.0;
    cursor: hand; 
    
    color: rgb(40, 40, 40);
    background: #F9ECB7; /* for non-css3 browsers */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F9ECB7', endColorstr='#FFDB6B') !important; /* for IE D2CEAA*/
    background: -webkit-gradient(linear, left top, left bottom, from(#F9ECB7), to(#FFDB6B)); /* for webkit browsers */
    background: -moz-linear-gradient(top,  #F9ECB7,  #FFDB6B); /* for firefox 3.6+ */
}


.ui-state-default, .ui-widget-content .ui-state-default {
    background: url("../images/?new=f6f6f6&w=1&h=400&f=png&q=100&fltr[]=over|textures/02_glass.png|0|0|100") repeat-x scroll 50% 50% #F6F6F6;
    border: 1px solid #CCCCCC;

 
    outline: medium none;
}


.nf-rules-combo-arrow-ie7 {
    max-height: 22px;
    margin-top: 1px;
}

.ui-combobox-toggle {
	POSITION: absolute !important; PADDING-BOTTOM: 0px !important; PADDING-LEFT: 0px !important; BOTTOM: 0px !important; PADDING-RIGHT: 0px !important; MARGIN-LEFT: -1px !important; TOP: 0px !important; PADDING-TOP: 0px  !important;
	border-top: 1px solid #828790!important;
	border-right: 1px solid #828790!important;
	border-bottom: 1px solid #828790!important;
}
.ui-combobox-input {
	PADDING-BOTTOM: 0.3em; MARGIN: 0px; PADDING-LEFT: 0.3em; PADDING-RIGHT: 0.3em;PADDING-TOP: 0.3em;
	border: 1px solid #828790!important;
}
.ui-combobox {
    display: inline-block;
    position: relative;    
}

html[dir="rtl"] .ui-combobox-input {
    margin-left: -3px;
}

html[dir="rtl"] .ui-combobox > .ui-corner-left {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom-left-radius: 0px;
    border-top-left-radius: 0px;
}

html[dir="rtl"] .ui-combobox > .ui-corner-right {
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 0px;
    border-top-right-radius: 0px;
}

.ui-button {
    cursor: pointer;
    display: inline-block;
    margin-right: 0.1em;
    overflow: visible;
    padding: 0;
    position: relative;
    text-align: center;
    text-decoration: none !important;
}

.ui-button-icon-only {
 
}

.rules-edit-row1 {
    overflow: hidden;
    padding-left: 6px;
}

html[dir="rtl"] .rules-edit-row1 {
    overflow: hidden;
    padding-left: 6px;
    padding-right: 6px;
    float: right;
}

.rules-edit-row0{
    overflow: hidden;
    padding-left: 6px;
    margin-bottom: 2px;
}

.rules-edit-row2 {
    overflow: hidden;
    padding-left: 8px;
    
}

html[dir="rtl"] .rules-edit-row2 {
    display: inline;
}

.rules-edit-row1 > span, .rules-edit-row1 > div, .rules-color-picker-buttons > div, .rules-color-picker-buttons > span {
    float: left;    
}

html[dir="rtl"] .rules-edit-row1 > span, html[dir="rtl"] .rules-edit-row1 > div, .rules-color-picker-buttons > div, .rules-color-picker-buttons > span {
    float: right;    
}

.rules-edit-row1 > span:nth-child(2) {

    
}

#RulesExpressionDiv .ms-inputuserfield, #RulesExpressionDiv .ms-inputuserfield > div {
    height: 40px!important;
}

html[dir="ltr"] #rulesFontSizeSpan {
   margin-left: 14px;    
}

html[dir="rtl"] #rulesFontSizeSpan {
    margin-right: 14px; 
}

#rulesFontTypeSpan > span > a {
    max-width: 12px;
}

#rulesFontSizeSpan > span > a {
    max-width: 12px;
}

.rules_FontSizePicker li {
    direction: ltr;
}

.rules-color-picker-buttons {
    margin-left: 14px;
    overflow: hidden;
}

html[dir="rtl"] .rules-color-picker-buttons {
    margin-right: 14px;
    overflow: hidden;
}

.ui-button-text {
    display: none;
}

.nf-rules-button-color {
    border: 1px solid #828790!important;
    max-width: 27px;
}

.nf-rules-edit-input {
    min-height: 14px;
}


.nf-rules-edit-button {
    margin-left: -4px !important;
}
.nf-rules-edit-button SPAN  IMG 
{
    border-width: 0px;
}    

.ruleFormatPreviewArea-default {
    overflow: auto;
    width: 193px;
    background-color: #FFFFFF;
    height: 65px;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 3px;
    padding-bottom: 3px;
    font-size: 12pt;
    text-align: center;
    color: black;
    margin-left: 6px;
    border: 1px solid rgb(80, 80, 80);
}

.ruleApplyBold {
    font-weight: bold !important;
}

.ruleApplyItalic {
    font-style: italic !important;
}

.ruleApplyUnderline {
    text-decoration: underline !important;
}

.ruleApplyStrikethrough {
    text-decoration: line-through !important;
}

.ruleApplyLeftAlign {
    text-align: left !important;
}

.ruleApplyRightAlign {
    text-align: right !important;
}

.ruleApplyMiddleAlign {
    text-align: center !important;
}

.ruleApplyJustifyAlign {
    text-align: justify !important;
}

.ruleApplyClear {
    text-align: inherit !important;
    text-decoration: inherit !important;
    font-style: inherit !important;
    font-weight: inherit !important;
    color: black !important;
    background-color: white !important;
    font-size: inherit !important;
}

.nf-rules-input-mask 
{
    font-style: italic;
    border: 1px solid #828790!important;
}

.nf-rules-info {
    font-weight: normal;
    border: none;
    padding: 4px;
    filter:alpha(opacity=80); 
    opacity:.80;
    width: auto;
}

.nf-rules-linked-icon {
    float: left;
}

html[dir="rtl"] .nf-rules-linked-icon {
    float: right;
}

.nf-rules-menu-ie7-icon {
    padding-right: 5px;
}

.nf-listitem-button-unselected {
    filter:alpha(opacity=70); 
    opacity:.70;  
}

html[dir="rtl"] .nf-formVariables-left-section{
     float: right !important;
}
.nf-formVariables-left-section {
    float: left;
    margin: 5px;
}

html[dir="rtl"] .nf-formVariables-right-section{
     float: left !important;
}
.nf-formVariables-right-section {
    float: right;
    width: 400px;
    height: 420px;
    border: 1px solid rgb(80,80,80);
    margin: 5px;
}

.nf-listitem {
    cursor: pointer;
}


#uiVariablesList
{
    position: absolute;
    top: 75px; 
    overflow-y: scroll;
    overflow-x: hidden;
    min-height: 420px;
    max-height: 420px;
	min-width: 250px;
    max-width: 250px;
    width: 100%;
    border: 1px solid rgb(80,80,80);
    list-style-type: none;
    padding: 0px;
    margin-left: 0px;
}

.nf-dialog-toolbar {
    text-align: left;
    min-height: 60px;  
    color: rgb(60,60,60);
    font-size: 8pt;
    width: 100%; 
}


.nf-dialog-header {
    text-align: left;
    min-height: 60px;  
    color: rgb(60,60,60);
    border: 1px solid #e1e1e1;
    font-size: 8pt;
 
    padding-left: 10px;
    padding-right: 10px; 
    padding-top: 5px;
}

.nf-formVariables-edit-area {
    border-collapse: collapse;
    width: 100%;
    height: 100%;
    display: table;
}

.nf-dialog-toolbar-item:hover 
{
    cursor: pointer;
	outline: 1px solid rgb(146, 183, 209);
}

.nf-dialog-toolbar-item
{
    padding-right: 5px;
    padding-left: 5px;
    
}

.nf-toolbar-command-text {
    padding-left: 4px;
}

.nf-variable-major-heading 
{
    font-size: 10pt;
    padding-left: 5px;
    padding-top: 8px;
    padding-bottom: 8px;
    display: table-cell;
    width: 35%;
    vertical-align: top;
}

.nf-variable-control-area {
    padding-top: 8px;
    padding-bottom: 8px;
    padding-right: 4px;
    padding-left: 5px;
    display: table-cell;
}

.nf-variable-edit-control {
    min-height: 22px;
    min-width: 250px;
    border-color: #828790 !important;
    border-width: 1px !important;
    border-style: solid !important;
    background-color: #fff !important;
    padding-left: 4px;
	font-family: inherit;
	font-size: inherit;
	vertical-align: middle;
	padding-top: 0px !important;
	padding-bottom: 0px !important;
}

.nf-variable-edit-control-inner {
    min-height: 20px;
    padding-left: 4px;
}

.nf-variable-edit-control-text {
	line-height: 14pt !important;
}

.nf-variable-edit-control {
    min-height: 22px;
    min-width: 200px;
    border-color: #828790 !important;
    border-width: 1px !important;
    border-style: solid !important;
    background-color: #fff !important;
    padding-left: 4px;
	font-family: inherit;
	font-size: inherit;
	vertical-align: middle;
	padding-top: 0px !important;
	padding-bottom: 0px !important;
}

.nf-variable-edit-control-text {
	line-height: 14pt !important;
}

.nf-variable-edit-expression-div {
    height: 60px !important;
}

.nf-variable-left-area {

    width: 16px;
    height: 16px;
}

.nf-variable-edit-section {
    border-top: 1px solid #d8d8d8;
    display: table-row;
}

.nf-dialog-toolbar-divider {
    border-left: 1px solid rgb(220, 220, 220);
    width: 1px;
    padding-top: 5px;
    padding-bottom: 5px;  
}




.smallColorPicker_font_button_back{width:30px;height:19px;background:url("/_layouts/NintexForms/images/color_button.png");cursor:pointer;border:solid 1px #4A4A4A;position:relative;}
.smallColorPicker_button_back{width:32px;height:21px;background:url("/_layouts/NintexForms/images/picker_back.jpg");cursor:pointer;border:solid 1px #4A4A4A;position:relative;}
.smallColorPicker_button_color{width:17px;height:4px;margin:16px 0 0 2px;position:absolute;overflow:hidden;}            
.smallColorPicker_button_back_popup{border-top: 1px solid white;z-index:2;}      
.picker_panel{position:absolute;background-color:#fff;margin-top:-1px;border:solid 1px #4A4A4A;z-index:1;display:none;width:178px;}
.picker_panel_header{background:url("/_layouts/NintexForms/images/picker_popup_back.jpg") no-repeat scroll center 3px transparent; height:10px;}
.clear{clear:both;}
.color_parent{height:20px; width:18px;padding:2px;float:left;display:inline;overflow:hidden;}
.color_parent a{padding:2px;display:block;}
.color_parent a:hover{border:solid 1px #1b253e;}
.color_parent a div{height:10px; width:11px;border:solid 1px #808080;overflow:hidden;}


.ui-icon-bold {
    background-image: url("/_layouts/15/NintexForms/images/NF_16x16_FormatMap.png") !important;
    left: 0px;
    top: -64px;
    width: 16px;
    height:16px;
    background-position: 0px -64px;
}

#uiRules {
    bottom: 0px;
    overflow: hidden;
    position: absolute;
    top: 30px;
    width: 100%;
}

.rules-edit-color-button {
    width:27px !important;
    height:21px !important;
    background-image:url("/_layouts/15/NintexForms/images/color_button27x21.png") !important;
    cursor:pointer;
    left: auto !important;
    position: relative !important;
    margin: auto !important;  
}

.rules-edit-color-button:hover {

    background-image:url("/_layouts/15/NintexForms/images/color_hover27x21.png") !important;
    border: none !important;
}

.rules-edit-background-button:hover {

    background-image:url("/_layouts/15/NintexForms/images/background_hover27x21.png") !important;
    border: none !important;
}
.rules-edit-background-button  {
    width:27px !important;
    height:21px !important;
    background-image:url("/_layouts/15/NintexForms/images/background27x21.png") !important;
    cursor:pointer;
    left: auto !important;
    position: relative !important;
    margin: auto !important;  
}


#uiVariablesList
{
    top: 112px;
}

.nf-rules-list-header {
    color: rgb(60, 60, 60);
    font-family: "Segoe UI", "Segoe", Tahoma, Helvetica, Arial, sans-serif;
    font-size: 13px;
    min-height: 40px;
    text-align: left;
}

.nf-toolbar-newVariable {
    background-image: url("/_layouts/15/NintexForms/images/NF_32x32_ImageMaps.png") !important;
    left: 0px;
    top: -64px;
    width: 32px;
    height:32px;
    background-position: -256px -64px;
}

.nf-toolbar-saveVariables {
    background-image: url("/_layouts/15/NintexForms/images/NF_32x32_ImageMaps.png") !important;
    left: 0px;
    top: -64px;
    width: 32px;
    height:32px;
    background-position: -64px -64px;
}

.nf-toolbar-closeVariables {
    background-image: url("/_layouts/15/NintexForms/images/NF_32x32_ImageMaps.png") !important;
    left: 0px;
    top: -64px;
    width: 32px;
    height:32px;
    background-position: 0px -64px;
}

.nf-toolbar-helpVariable {
    background-image: url("/_layouts/15/NintexForms/images/NF_32x32_ImageMaps.png") !important;
    left: -32px;
    top: 0px;
    width: 32px;
    height:32px;
    background-position: -32px 0px; 
}



