#txTemplateDesignerContainer {
    font-family: Arial, Helvetica, sans-serif;
    color: #5E5E5E !important;
    background-color: #F0F0F0;
    overflow: hidden;
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    line-height: normal;    /* Bootstrap override */
}

#txTemplateDesignerContainer * {
    box-sizing: content-box !important; /* Bootstrap override */
}

#txTemplateDesignerContainer img {
    border: none;
	 vertical-align: baseline !important;
}

#txTemplateDesignerContainer td {
	padding: 1px;
}

#txTemplateDesignerContainer table {
	border-spacing: 2px;
	margin: 0px;
}

#txTemplateDesignerContainer ul.tabs {
    margin: 0;
    padding: 0;
    width: 100%;
    float: left;
}

#txTemplateDesignerContainer ul.tabs li {
    display: block;
    padding: 0 4px;
    float: left !important;
    text-transform: uppercase;
}

#txTemplateDesignerContainer ul.tabs li:first-child {
	padding-left: 8px
}

#txTemplateDesignerContainer ul.tabs li a {
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 12px !important;
    display: block;
    position: relative;
    border: 1px solid transparent;
    padding: 3px 4px !important;
    height: 15px !important;
    color: #5E5E5E !important;
    text-decoration: none !important;
}

#txTemplateDesignerContainer ul.tabs li a.selected {
    border-left: 1px solid #BBBBBB;
    border-right: 1px solid #BBBBBB;
    border-top: 1px solid #BBBBBB;
    border-bottom: 1px solid white;
    color: #2B579A !important;
    /* font-weight: bold; */
}

#txTemplateDesignerContainer ul.tabs li a:not(.selected):hover {
    background-color: #D5E1F2;
    border-bottom: 1px solid #BBBBBB;
}

#txTemplateDesignerContainer ul.tabs li a:active {
    background-color: #A3BDE3;
    outline: none;
}

/* Contextual tabs */

#txTemplateDesignerContainer #tabTableLayout {
    color: #14C100 !important;
}

#txTemplateDesignerContainer #tabTableLayout:not(.selected):hover {
    background-color: rgba(88, 255, 0, 0.2);
}

#txTemplateDesignerContainer #tabTableLayout.selected {
    border-left-color: #14C100;
    border-top-color: #14C100;
    border-right-color: #14C100;
}

#txTemplateDesignerContainer #tabObjectFormat {
    color: #E67FFE !important;
}

#txTemplateDesignerContainer #tabObjectFormat:not(.selected):hover {
    background-color: rgba(206, 0, 255, 0.1)
}

#txTemplateDesignerContainer #tabObjectFormat.selected {
    border-left-color: #E67FFE;
    border-top-color: #E67FFE;
    border-right-color: #E67FFE;
}

#txTemplateDesignerContainer #tabFrameFormatting {
    color: #E67FFE !important;
}

#txTemplateDesignerContainer #tabFrameFormatting:not(.selected):hover {
    background-color: rgba(206, 0, 255, 0.1)
}

#txTemplateDesignerContainer #tabFrameFormatting.selected {
    border-left-color: #E67FFE;
    border-top-color: #E67FFE;
    border-right-color: #E67FFE;
}

#txTemplateDesignerContainer #tabChartFormatting {
    color: #33a3f4 !important;
}

#txTemplateDesignerContainer #tabChartFormatting:not(.selected):hover {
    background-color: rgba(51, 163, 244, 0.1)
}

#txTemplateDesignerContainer #tabChartFormatting.selected {
    border-left-color: #33a3f4;
    border-top-color: #33a3f4;
    border-right-color: #33a3f4;
}

#txTemplateDesignerContainer .tab-content {
	 clear: both;
    padding-left: 8px;
}

/* RIBBON GROUP STYLES */

/* Outer div around ribbon groups */
#txTemplateDesignerContainer div.ribbon-group {
    margin-top: 5px;
    float: left;
    border-right: 1px solid;
    border-right-color: #bbbbbb;
    padding-left: 5px;
    padding-right: 5px;
}

#txTemplateDesignerContainer div.ribbon-group input[type=checkbox] {
	width: 13px;
	height: 13px;
}

#txTemplateDesignerContainer div.ribbon-group:first-child {
    padding-left: 0px;
}

/* Div around ui elements in a ribbon group */
#txTemplateDesignerContainer div.ribbon-group-content {
    height: 65px;
}

#txTemplateDesignerContainer div.ribbon-group-content input[type=number],
#txTemplateDesignerContainer div.ribbon-group-content input[type=text] {
	margin: 0px;
	border: 1px solid #ababab;
	font-size: 12px;
	padding: 2px 1px;
}

#txTemplateDesignerContainer div.ribbon-group-content input:disabled[type=number],
#txTemplateDesignerContainer div.ribbon-group-content input:disabled[type=text] {
	background-color: #f8f8f8;
	border-color: #ddd;
}

#txTemplateDesignerContainer div.checked-list-box {
	float: left;
	border: 1px solid #ababab;
	margin: 0px 5px;
	overflow-x: hidden;
	overflow-y: auto;
}

#txTemplateDesignerContainer div.checked-list-box:first-child {
	margin-left: 0px;
}

#txTemplateDesignerContainer div.checked-list-box:last-child {
	margin-right: 0px;
}

#txTemplateDesignerContainer div.checked-list-box table.checked-list-box-item-container {
	border-collapse: collapse;
	font-size: 11px !important;
	border: none;
	margin: 0px;
}

#txTemplateDesignerContainer div.checked-list-box table.checked-list-box-item-container td {
	padding: 0px;
}


#txTemplateDesignerContainer div.checked-list-box table.checked-list-box-item-container td label {
	margin: 3px 0px !important;
	padding: 0px !important;
	font-weight: normal !important;
	font-size: 11px;
}

/* General ribbon button properties */

#txTemplateDesignerContainer div.ribbon-button {
    float: left;
    /* border-radius: 2px; */
}

#txTemplateDesignerContainer div.ribbon-button img {
    pointer-events: none;
}

/* Enabled button hover style */
#txTemplateDesignerContainer div.ribbon-button:not(.txui-state-disabled):hover {
    background-color: #D5E1F2
}

/* Enabled button style while mouse button is clicked and held down */
#txTemplateDesignerContainer div.ribbon-button:not(.txui-state-disabled):active {
    background-color: #A3BDE3;
}

/* "Selected" (toggled) button style (e. g. bold, italic etc.) */
#txTemplateDesignerContainer div.ribbon-button-selected {
    background-color: #C2D5F2;
}

/* "Selected" (toggled) button hover style */
#txTemplateDesignerContainer div.ribbon-button-selected:not(.txui-state-disabled):hover {
    background-color: #D5E1F2;
}

/* "Selected" (toggled) button style while mouse button is clicked and held down */
#txTemplateDesignerContainer div.ribbon-button-selected:not(.txui-state-disabled):active {
    background-color: #A3BDE3;
}

#txTemplateDesignerContainer div.ribbon-button-checkmark:not(.ribbon-button-selected) > img {
    visibility: hidden;
}

#txTemplateDesignerContainer div.ribbon-button-checkmark:not(.ribbon-button-selected):hover > img {
    visibility: visible;
    opacity: 0.3;
}

/* Big ribbon buttons with a label below the icon */

#txTemplateDesignerContainer div.ribbon-button-big {
    margin-right: 5px;
}

#txTemplateDesignerContainer div.ribbon-button-big:first-child {
    margin-left: 5px;
}

#txTemplateDesignerContainer div.ribbon-button-big-image-container {
    height: 32px;
    overflow: hidden;
    pointer-events: none;
    margin-top: 3px;
    margin-left: 3px;
    margin-right: 3px;
}

#txTemplateDesignerContainer img.ribbon-button-big-image {
    display: block;
    margin: auto;
}

#txTemplateDesignerContainer div.ribbon-button-big-label-container {
    text-align: center;
    height: 32px;
    pointer-events: none;
}

#txTemplateDesignerContainer span.drop-down-arrow-large {
    font-size: 75%;
    color: #555555;
}

/* 42px ribbon buttons (only needed for bullet list type images) */
#txTemplateDesignerContainer div.ribbon-button-42px {
    padding: 5px;
    height: 42px;
}

/* 86x84 px buttons (only needed for numbered and structured list type images) */
#txTemplateDesignerContainer div.ribbon-button-numbered-list {
    padding: 5px;
    width: 86px;
    height: 84px;
}

#txTemplateDesignerContainer div.ribbon-button-numbered-list > img {
    outline: 1px solid #D3D3D3;
}

/* Small ribbon buttons with a label to the right side of the icon */

#txTemplateDesignerContainer div.ribbon-button-small {
    clear: left;
    width: 100%;
    margin-bottom: 2px;
    margin-right: 5px;
    padding: 2px;
}

#txTemplateDesignerContainer div.ribbon-button-small-label-container {
    float: left;
    pointer-events: none;
	 margin-left: 2px;
    margin-top: 2px;
}

#txTemplateDesignerContainer div.ribbon-button-wrapper-small-stacked-buttons {
    float: left;
    margin-right: 4px;
}

/* Small buttons like bold, italic etc. */
#txTemplateDesignerContainer div.ribbon-button-tiny {
    height: 16px;
    width: 16px;
    padding: 3px;
}

/* Small dropdown buttons */
#txTemplateDesignerContainer div.ribbon-dropdown-button-tiny {
    height: 16px;
    /* width: auto; */
    padding: 3px;
}

#txTemplateDesignerContainer div.ribbon-dropdown-button-tiny > * {
    float: left;
}

#txTemplateDesignerContainer div.ribbon-dropdown-button-tiny > img {
    display: block;
}

#txTemplateDesignerContainer div.ribbon-dropdown-button-tiny > p {
    font-size: 8px;
    margin-left: 2px; 
    margin-top: 3px; 
    color: #555555
}

#txTemplateDesignerContainer div.ribbon-button-small-image-container {
    width: 16px;
    height: 16px;
    overflow: hidden;
    float: left;
    margin-right: 5px;
    pointer-events: none;
}

#txTemplateDesignerContainer .ribbon-button-label {
    margin: 0px !important;
    display: block;
    pointer-events: none !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 11px !important;
    text-align: center !important;
}

#txTemplateDesignerContainer div.ribbon-checkbox div.ribbon-button-small-label-container {
    margin-top: 5px;
}

#txTemplateDesignerContainer div.ribbon-checkbox div.ribbon-button-small-label-container,
#txTemplateDesignerContainer label.ribbon-button-label {
    pointer-events: all !important;
}

#txTemplateDesignerContainer label.ribbon-button-label {
    font-weight: normal;    /* Bootstrap override */
}

#txTemplateDesignerContainer div.ribbon-group-label-container {
    text-align: center;
    margin-top: 6px;
}

#txTemplateDesignerContainer p.ribbon-group-label {
    margin: 0pt;
    font-size: 11px;
    /* letter-spacing: 0.5pt; */
}

/* FF additions to ribbon group label style */
@-moz-document url-prefix() {
    #txTemplateDesignerContainer p.ribbon-group-label {
        margin-top: -2px;
    }
}


#txTemplateDesignerContainer div.ribbon-group-content-row {
    float: left;
    clear: left;
    height: 22px;
    padding-top: 4px;
    padding-bottom: 4px;
}

#txTemplateDesignerContainer div.ribbon-group-button-group {
    float: left;
    border-right: 1px solid;
    border-color: #bbbbbb;
    padding-left: 5px;
    padding-right: 5px;
}

#txTemplateDesignerContainer div.ribbon-group-button-group:first-child {
    padding-left: 0px;
}

#txTemplateDesignerContainer div.ribbon-group-button-group:last-child {
    border-right: none;
    padding-right: 0px;
}

/* END OF RIBBON GROUP STYLES */

/* Menu item stuff */

/* jquery menus */
#txTemplateDesignerContainer ul.txui-menu {
    background-image: none;
    border-radius: 0px;
    border: 1px solid #ABABAB;
    width: auto; /* 150px */
}

/* jquery menu list items */
#txTemplateDesignerContainer ul.txui-menu li.txui-menu-item {
    font-size: 11px;
    display: block;
    /* height: 0px; */
    margin: 0;
    /* pointer-events: none; */
    float: left;
}

/* Symbol menu special treatment */
#insertSymbolDropDown li.txui-menu-item {
    height: auto;
}

#shapeStylesDropDown li.txui-menu-item {
   float: left;
   width: auto;
}

#shapeStylesDropDown li.txui-menu-item img {
   margin: 2px;
}

/* Anchor tags in jquery menu items */
#txTemplateDesignerContainer ul.txui-menu li.txui-menu-item a {
    padding: 0px;
    clear: right;
    float: left;
    width: 100%;
    border-radius: 0px;
    overflow: hidden;
}

/* Hovered anchor tags in jquery menu items */
#txTemplateDesignerContainer ul.txui-menu li.txui-menu-item a.txui-state-focus {
    border: none;
    margin: 0px;
    background-image: none;
    background-color: #D5E1F2;
    border-radius: 0px;
}

/* Active anchor tags in jquery menu items */
#txTemplateDesignerContainer ul.txui-menu li.txui-menu-item a.txui-state-active {
    border: none;
    margin: 0px;
    background-image: none;
    background-color: #D5E1F2;
    border-radius: 0px;
}

/* DIV around large menu item image (32px, e. g. in file menu or under drop down buttons) */
#txTemplateDesignerContainer .txui-menu div.large-menu-item-image-container {
    float: left; 
    overflow: hidden; 
    width: 32px; 
    height: 32px; 
    margin-top: 3px; 
    margin-right: 4px;
    margin-left: 3px;
}

#txTemplateDesignerContainer .txui-menu div.large-menu-item-image-container-long-caption {
    float: left; 
    overflow: hidden; 
    width: 32px; 
    height: 32px; 
    margin-top: 8px; 
    margin-right: 4px;
    margin-left: 3px;
}

#txTemplateDesignerContainer .txui-menu div.menu-item-caption-container-42px {
    float: left; 
    margin-left: 5px;
}

#txTemplateDesignerContainer .txui-menu div.menu-item-caption-container-42px p {
    margin-top: 16px;
}

#txTemplateDesignerContainer .txui-menu div.menu-item-caption-container-numbered-list {
    float: left; 
    margin-left: 10px;
}

#txTemplateDesignerContainer .txui-menu div.menu-item-caption-container-numbered-list p {
    margin-top: 36px;
}

#txTemplateDesignerContainer .txui-menu div.large-menu-item-caption-container {
    float: left; 
    font-family: Arial, Helvetica, sans-serif !important;
}

#txTemplateDesignerContainer .txui-menu div.large-menu-item-caption-container p {
    margin: 11px 0px; /* Bootstrap override */
}

#txTemplateDesignerContainer .txui-menu div.large-menu-item-long-caption-container {
    float: left; 
    min-height: 48px;
}

#txTemplateDesignerContainer .txui-menu div.large-menu-item-long-caption-container h1 {
    color: #5E5E5E !important;
    line-height: 16.5px !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 11px !important;
    margin-top: 4px !important;
    margin-bottom: 2px !important;
    font-weight: bold !important;
}

#txTemplateDesignerContainer .txui-menu div.large-menu-item-long-caption-container p {
    margin: 0px;
}

#txTemplateDesignerContainer .txui-menu div.large-menu-item-long-caption-container p:last-child {
    margin-bottom: 2px !important;
    color: #5E5E5E !important;
    display: block;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 11px !important;
    font-weight: normal !important;
    text-align: left !important;
}

#txTemplateDesignerContainer .txui-menu div.small-menu-item-caption-container {
    float: left; 
    padding-left: 5px;
    font-family: Arial, Helvetica, sans-serif;
}

#txTemplateDesignerContainer .txui-menu div.small-menu-item-caption-container p {
    margin-top: 3px;
    margin-bottom: 3px;
	 cursor: default;
}

#txTemplateDesignerContainer #tabFile {
    color: white !important; 
    /* background-color: rgb(25, 121, 202) !important; */
    background-color: #2B579A !important;
    text-align:center !important;
    border: none;
    padding: 4px 16px !important;
}

#txTemplateDesignerContainer #tabFile:hover {
    background-color: rgb(41, 140, 225) !important; 
}

/* CSS for combo boxes */
#txTemplateDesignerContainer select,
.txDialog select {
    padding: .5px;
    margin: 0;
    background: white;
    border: 1px solid #ABABAB;
    outline: none;
    display: inline-block;
    cursor: pointer;
}

#txTemplateDesignerContainer select {
	font-size: 13px;
}

.txDialog select {
	font-size: 12px;
}

#txTemplateDesignerContainer select:not([size]),
.txDialog select:not([size]) {
	max-height: 20px;
}

/* CSS for icons */

#txTemplateDesignerContainer div.txui-state-disabled,
.txDialog div.txui-state-disabled {
    color: gray; /* style for disabled ribbon bar controls */
    pointer-events: none;
}

#txTemplateDesignerContainer .button-hover {
    background-color: orange; /* style for hovering over ribbon bar control groups */
}

#txTemplateDesignerContainer #ribbonbar {
    position: absolute; 
    top: 0px; 
    left: 0px; 
    width: 100%; 
    min-width: 2500px;
    height: 114px; 
    background-color: white;
    border-bottom: 1px solid #BBBBBB;
    z-index: 50;
    cursor: default; /* don't change cursor when moving over text areas in the ribbon bar */
    /* overflow: hidden; */ /* This cuts off drop down menus */
    transition: transform 0.5s;
    -webkit-transition: -webkit-transform 0.5s;
}

#txRibbonCover {
    position: absolute; 
    width: 100%; 
    height: 100%; 
    background-color: #F0F0F0;
    z-index: 2; 
    transition: opacity 1s;
}

#txTemplateDesignerContainer #ribbonbar .txRibbonScrollArrow {
    position: absolute;
    margin-top: 43px;
    border: none;
    background: lightgray;
    width: 15px;
    height: 50px;
    z-index: 1;
    opacity: 0.7;
    transition: opacity 0.3s;
}

#txTemplateDesignerContainer #ribbonbar .txRibbonScrollArrow:hover {
    opacity: 1;
}

#txTemplateDesignerContainer #ribbonbar .txRibbonScrollArrow:active {
    background: #555555;
}

#txTemplateDesignerContainer #ribbonbar .txRibbonScrollArrow:active #txBlackTriangleR {
    border-left-color: white;
}

#txTemplateDesignerContainer #ribbonbar .txRibbonScrollArrow:active #txBlackTriangleL {
    border-right-color: white;
}

#txRibbonScrollButtonRight {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

#txRibbonScrollButtonLeft {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

#txTemplateDesignerContainer #ribbonbar .txTriangle {
    position: absolute; 
    width: 0px; 
    height: 0px; 
    top: 20px;
}

#txBlackTriangleR {
    left: 6px;
    border-left: 5px solid black;
    border-bottom: 5px solid transparent; 
    border-top: 5px solid transparent; 
    border-right: 5px solid transparent;
}

#txBlackTriangleL {
    left: 1px;
    border-left: 5px solid transparent; 
    border-bottom: 5px solid transparent; 
    border-top: 5px solid transparent; 
    border-right: 5px solid black;
}

#txRibbonContentArea {
    display: inline-block;
    width: 100%;
    float: left;
    clear: left;
    margin-top: -1px;
    padding: 0px;
    border-top: 1px solid #BBBBBB;
}

#txRibbonTabContentContainer {
    display: inline-block;
    float: left;
    clear: left;
    margin: 0;
    border: none;
    padding: 0;
    transition: transform 0.5s;
    -webkit-transition: -webkit-transform 0.5s;
}

#txTemplateDesignerContainer #selectFontSize {
    width: 44px; 
}

#txTemplateDesignerContainer #selectFont {
    width: 140px; 
}

#txTemplateDesignerContainer canvas {
    transition: opacity 1s;
    -webkit-user-select: none;
}

#txTemplateDesignerContainer #mainCanvas { 
    position: absolute; 
    cursor: text; 
}

#txTemplateDesignerContainer #horRulerCanvas {
    position: absolute;
    left: 0px;
    z-index: 5;
    /* border-top: 3px solid #DCE7F5; */
}

#txTemplateDesignerContainer #vertRulerCanvas {
    position: absolute;
    left: 0px;
    z-index: 5;
}

#txTemplateDesignerContainer #statusBarCanvas {
    position: absolute;
    left: 0px;
    z-index: 5;
    /* border-top: 1px solid lightgray; */
}

#txTemplateDesignerContainer ul.dropDownMenu {
    position: absolute;
    z-index: 1000;
}

.unselectable {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
	 cursor: default;
}

#txTemplateDesignerContainer #insertSymbolDropDown li {
    float: left; 
    width: 26px;
}

#txTemplateDesignerContainer #insertSymbolDropDown li.txui-menu-item a {
    font-size: 12pt;
    height: 26px; 
    width: 26px; 
    padding-top: 1px;
    text-align: center;
}

#txTemplateDesignerContainer div.menu-item-category-header {
    background-color: #eeeeee;
}

#txTemplateDesignerContainer div.menu-item-category-header h1 {
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 11px !important;
    color: #555555 !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    margin-left: 5px !important;
    line-height: 1.5;   /* Bootstrap override */
    font-weight: bold;  /* Bootstrap override */
}

/* Removes the yellow / blue glowing outline from 
   selected text input elements */
.txDialog textarea, 
.txDialog input { 
    outline: none; 
	 width: initial;
	 border: initial;
	 color: initial;
	 padding: 1px 0px;
	 margin: initial;
	 font-size: 12px;
}

.txDialog input[type=file] {
	background: initial;
}

.txDialog textarea:not([disabled]),
.txDialog input:not([disabled]):not([type=file]) {
	background: white;
}

.txDialog textarea:disabled,
.txDialog input:disabled {
	background: initial;
}

.txDialog input[type="checkbox"] {
    margin: 3px 3px 3px 4px;    /* Bootstrap override */
}

.txDialog input[type="radio"] {
    margin: 3px 3px 0px 5px;    /* Bootstrap override */
}

.txDialog legend {
    padding: initial;
    border: initial;
    margin-bottom: initial;
    font-size: 12px;    /* Bootstrap override */
    width: auto;
	 display: block;
}

/* Fiddling with "insert merge field" dropdown menu items. 
   ToDo: Try to simplify / generalize this some day. */

#txTemplateDesignerContainer .tableDropDown > li > a > .txui-icon {
    margin-top: 10px;
}

#txTemplateDesignerContainer .tableDropDown > li.txui-menu-item > a {
    overflow:hidden;
}

/* Sliders */

#txTemplateDesignerContainer div.txui-slider {
    border-radius: 0px;
    position: relative;
    /* margin: auto; */
    background: none;
    border: none;
}

#txTemplateDesignerContainer .txui-slider .txui-slider-handle {
    border: none;
    border-radius: 0px;
    background: #cdcdcd;
}

#txTemplateDesignerContainer .txui-slider .txui-slider-handle:hover {
    background: #a6a6a6;
}

#txTemplateDesignerContainer .txui-slider .txui-slider-handle:active {
    background: #606060;
}

#txTemplateDesignerContainer .txui-slider .txui-slider-handle:focus {
    outline: none;
}

#txTemplateDesignerContainer div.scrollbar-wrapper {
    position: absolute;
    border: none;
    overflow: hidden;
    background: #f0f0f0;
    z-index: 49;  /* Below ribbon bar so long ribbon menus stay on top of the scroll bar */
    display: none;
}

/* Scrollbar arrow buttons */

#txTemplateDesignerContainer div.scroll-button {
    position: absolute;
    background: #f0f0f0;
    color: #606060;
    cursor: default;
    z-index: 49;   /* Below ribbon bar so long ribbon menus stay on top of the scroll bar */
    display: none;
}

#txTemplateDesignerContainer div.scroll-button-vert {
    width: 15px;
    height: 17px;
}

#txTemplateDesignerContainer div.scroll-button-hor {
    width: 17px;
    height: 15px;
}

#txTemplateDesignerContainer div.scroll-button:hover {
    background: #dadada;
}

#txTemplateDesignerContainer div.scroll-button:active {
    background: #606060;
}

/* Scroll button arrow sprites */

#txTemplateDesignerContainer div.scroll-button-vert > div.scroll-button-arrow-wrapper {
    margin: 5px 4px 5px 4px;
}

#txTemplateDesignerContainer div.scroll-button-hor > div.scroll-button-arrow-wrapper {
    margin: 4px 5px 4px 5px;
}

#txTemplateDesignerContainer div.scroll-button-arrow-wrapper {
    position: relative;
    background-image: url(../Icons/web/scrollbar_arrow_sprites.png);
    background-repeat: no-repeat;
    overflow: hidden;
    pointer-events: none;   
    width: 7px;
    height: 7px;
}

#scroll-button-up > div.scroll-button-arrow-wrapper {
    background-position: -14px 0px;
}

#scroll-button-down > div.scroll-button-arrow-wrapper {
    background-position: -21px 0px;
}

#scroll-button-left > div.scroll-button-arrow-wrapper {
    background-position: -7px 0px;
}

/* HOVER */

#scroll-button-up:hover > div.scroll-button-arrow-wrapper {
    background-position: -42px 0px;
}

#scroll-button-down:hover > div.scroll-button-arrow-wrapper {
    background-position: -49px 0px;
}

#scroll-button-left:hover > div.scroll-button-arrow-wrapper {
    background-position: -35px 0px;
}

#scroll-button-right:hover > div.scroll-button-arrow-wrapper {
    background-position: -28px 0px;
}

/* ACTIVE */

#scroll-button-up:active > div.scroll-button-arrow-wrapper {
    background-position: -70px 0px;
}

#scroll-button-down:active > div.scroll-button-arrow-wrapper {
    background-position: -77px 0px;
}

#scroll-button-left:active > div.scroll-button-arrow-wrapper {
    background-position: -63px 0px;
}

#scroll-button-right:active > div.scroll-button-arrow-wrapper {
    background-position: -56px 0px;
}

#txTemplateDesignerContainer div.ribbon-checkbox {
    height: 23px;
    clear: left;
}

#txTemplateDesignerContainer div.ribbon-checkbox-input-element-container {
    float: left;
}

#txTemplateDesignerContainer div.ribbon-checkbox-input-element-container input[type=checkbox] {
    margin: 5px 3px 3px 0px;    /* Bootstrap override */
}

/* DIALOGS */

div.txui-dialog {
    padding: 0px;
    border-radius: 0px;
    font-size: 10pt;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.3);
    background: #fbfbfb;
}

div.txui-dialog * {
    line-height: normal;    /* Bootstrap override */
    box-sizing: content-box !important; /* Bootstrap override */
}

div.txui-dialog div.txui-dialog-titlebar { 
    font-size: 12px; 
    font-weight: normal; 
    text-align: center;
    background-color: ActiveCaption; 
    background-image: none;
    border: none;
    border-radius: 0px;
    background: transparent;
}

div.txui-dialog-titlebar button.txui-dialog-titlebar-close {
    background: #c75050;
    border: none;
    top: 0;
    margin: 0;
    width: 30px;
}

div.txui-dialog-titlebar button.txui-dialog-titlebar-close:hover {
    background: #e04343;
}

div.txui-dialog-titlebar button.txui-dialog-titlebar-close span.txui-icon {
    background-image: url(images/ui-icons_ffffff_256x240.png);
}

div.txui-dialog div.txui-dialog-content {
    font-size: 12px; 
    border-top: 1px solid #dddddd;
    border-left: 1px solid #dddddd;
    border-bottom: none;
    border-right: 1px solid #dddddd;
    margin-left: 5px;
    margin-top: 0;
    margin-right: 5px;
    margin-bottom: 0;
    background: #f0f0f0;
}

div.txui-dialog-content input[type=text], 
div.txui-dialog-content input[type=password], 
div.txui-dialog-content textarea {
    border: 1px solid gray;
}

div.txui-dialog-content input[type=text]:focus,
div.txui-dialog-content input[type=password]:focus, 
div.txui-dialog-content textarea:focus {
    border: 1px solid #569de5;
}

div.txui-dialog-content span input {
    border: none;
}

div.txui-dialog-content label {
    display: block;
    /* clear: right; */
    /* font-size: 1em; */
    margin-top: 2px;
    margin-bottom: 6px;
    font-size: 12px;        /* Bootstrap override */
    font-weight: normal;    /* Bootstrap override */
}

div.txui-dialog-content fieldset {
    margin: 4px 2px;
    border: 1px solid lightgray;
    padding: 0.35em 0.75em 0.625em 0.75em;  /* Bootstrap override */
}

div.txui-dialog-content select {
    background-color: white;
    border: 1px solid gray;
}
div.txui-dialog-content td,
div.txui-dialog-content th {
    padding: 1px !important;   /* Bootstrap override */
}

div.txui-dialog-content table {
    border-spacing: 2px !important;    /* Bootstrap override */
}

.txDialog div.txui-tabs {
    padding: 0;
    border: none;
    background: transparent;
}

.txDialog div.txui-tabs .txui-tabs-nav { 
    background-color: transparent; 
    background-image: none;
    border-left: none;
    border-top: none;
    border-right: none;
}

.txDialog div.txui-tabs div.txui-tabs-panel {
    border-left: 1px solid #aaaaaa;
    border-bottom: 1px solid #aaaaaa;
    border-right: 1px solid #aaaaaa;
}

div.txui-dialog div.txui-dialog-buttonpane {
    border-top: none;
    border-left: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
    border-right: 1px solid #dddddd;
    font-size: 10pt;
    margin-left: 5px;
    margin-bottom: 5px;
    margin-right: 5px;
    margin-top: 0;
    background: #f0f0f0;
    padding: 0px 3px 3px 0px;
}

.txui-corner-all, .txui-corner-bottom {
    border-radius: 0;
}

div.txui-dialog-buttonset button.txui-button {
    border: 1px solid #acacac;
    background: #e5e5e5;
    min-width: 70px;
}

div.txui-dialog-buttonset button.txui-button:hover {
    border: 1px solid #7eb4ea;
    background: #e3f0fc;
}

.txDialog .txui-tabs-active a {
    outline: none;
}

button.txui-button span.txui-button-text {
    font-size: 12px;
    /* color: #5E5E5E; */
    padding: 5px 9px 5px 9px;
}

.no-close .txui-dialog-titlebar-close {
  display: none;
}

#txTemplateDesignerContainer div.caret,
div.txDialog div.caret
{
    position: absolute;
    border: none;
    margin: 0px;
    padding: 0px;
    background: #5E5E5E;
    /* Arbitrary initial size */
    width: 1px;
    height: 20px;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
    pointer-events: none;
    z-index: 4;
}

#txTemplateDesignerContainer div.txShapeDIV {
    position: absolute;
    border: 1px dashed #5E5E5E;
    margin: 0px;
    padding: 0px;
    opacity: 0;
    /* transition: opacity 0.3s ease-in-out; */
    pointer-events: none;
    z-index: 4;
    transition: border-color 0.4s linear;
}

#txTemplateDesignerContainer #ribbonTabTableLayout ul.dropDownMenu a[role=menuitem] > span {
    margin-top: 18px;
}

#txTemplateDesignerContainer div.small-menu-item-image-wrapper {
    height: 16px;
    width: 16px;
    padding: 3px;
    float: left;
}

body ul.contextMenu a[role=menuitem] > span {
    margin-top: 3px;
}

.txui-widget-overlay {
    background: none !important;
    background-image: none !important;
}

#txBtnRibbonHide {
    position: absolute;
    width: 20px;
    height: 20px;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}

#txBtnRibbonHide:hover {
    background: rgba(0, 0, 0, 0.1);
}

#txArrowRibbonHideWrapper {
    background-image: url(../Icons/web/ribbon_show_hide_arrow_sprites.png);
    background-repeat: no-repeat;
    overflow: hidden;
    position: absolute;
    width: 10px;
    height: 10px;
    left: 0px;
    top: 0px;
    margin: 5px;
}

#txArrowRibbonHideWrapper.down {
    background-position: -10px 0;
}

#txErrMsgDiv {
    position: absolute;
    left: 50%;
    top: 50%;
    white-space: nowrap;
    border: 1px solid #ABABAB;
    color: #5E5E5E;
    background-color: white;
    margin: 0;
    padding: 20px;
    /* font-family: 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', Geneva, Verdana, sans-serif; */
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    text-align: center;
    z-index: 9999;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.3);
    cursor: default;
}

#txTemplateDesignerContainer .txui-widget-content a {
    color: #5E5E5E !important;
}

#txTemplateDesignerContainer li[data-column-name],
#txTemplateDesignerContainer li[data-child-table-name] {
    font-family: Arial, Helvetica, sans-serif;
}

#txLoaderGif {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 2000;
    margin-top: -15px;
    margin-left: -15px;
    opacity: 0;
    transition: opacity 0.5s;
}

#txPrintFrame {
    position: fixed;
    overflow: hidden;
    width: 1px;
    height: 1px;
    left: -9999px;
}

#insertShapesDropDown a > span.txui-menu-icon,
#shapeOutlineDropDown a > span.txui-menu-icon {
   margin-top: 3px;
}

#insertChartDropDown a span.txui-menu-icon {
	margin-top: 10px;
}

/* "Insert Table Wizard" grid */

#txTemplateDesignerContainer .txInsertTableWizard {
	background-color: white;
}

#txTemplateDesignerContainer .txInsertTableWizard table {
	border-spacing: 3px;
	border-collapse: separate;
}

#txTemplateDesignerContainer .txInsertTableWizard td {
	width: 20px;
	height: 11px;
	border: 1px solid #646464;
}

#txTemplateDesignerContainer .txInsertTableWizard td.glowing {
	background-color: #ffdd9a;
	border-color: orange;
}

.txHiddenTextField {
	position: absolute;
	pointer-events: none;
	width: 10px;
	height: 10px;
	left: -9999px;
	top: -100px;
	overflow: hidden;
	margin: 0px;
	padding: 0px;
	border: none;
	z-index: -1000;
	color: black;
	background-color: white;
}

.txHiddenTextField:focus {
	outline: none;
}

#txTemplateDesignerContainer .ribbon-group-layout-table {
	border-collapse: collapse; 
	border: none;
	font-size: 11px !important;
}

#txTemplateDesignerContainer .ribbon-group-layout-table label {
	font-size: 11px !important;
	font-family: Arial, Helvetica, sans-serif !important;
	font-weight: 400;
}

#txTemplateDesignerContainer .ribbon-group-layout-table input[type=number] {
	width: 50px;
	height: 14px;
}

#txTemplateDesignerContainer .ribbon-group-layout-table input[type=number]:invalid {
	box-shadow: none;
}

#txTemplateDesignerContainer .ribbon-group img.txDialogLauncher {
	position: absolute;
	margin-bottom: 1px;
	margin-right: 1px;
	opacity: 0.6;
	transition: opacity 0.3s;
}

#txTemplateDesignerContainer .ribbon-group img.txDialogLauncher:hover {
	background-color: #D5E1F2;
	opacity: 1;
}

#txTemplateDesignerContainer .ribbon-group img.txDialogLauncher:active {
	background-color: #A3BDE3;
	opacity: 1;
}

#txTemplateDesignerContainer #fileMenu {
	cursor: default;
}

#txTemplateDesignerContainer #paperSizesDropDown li.menu-item-selected {
	background-color: #C2D5F2;
}

#txTemplateDesignerContainer .ribbon-group .ribbon-group-layout-table .ribbon-stacked-toggle-button,
#txTemplateDesignerContainer .ribbon-group .ribbon-button-wrapper-small-stacked-buttons .ribbon-stacked-toggle-button {
	margin: 0pt;
	padding: 0pt;
}

#txTemplateDesignerContainer .ribbon-group .ribbon-group-layout-table .ribbon-stacked-toggle-button .ribbon-button-small-label-container,
#txTemplateDesignerContainer .ribbon-group .ribbon-button-wrapper-small-stacked-buttons .ribbon-stacked-toggle-button .ribbon-button-small-label-container {
	margin-top: 5px;
}

#txTemplateDesignerContainer #ribbonGroupFrameSize div.ribbon-group-content,
#txTemplateDesignerContainer #ribbonGroupFrameProps div.ribbon-group-content {
	height: 55px;
}

#txTemplateDesignerContainer #tblRibbonGrpFrameSize,
#txTemplateDesignerContainer #tblRibbonGrpFrameProps {
	margin-top: 10px;
}

#txTemplateDesignerContainer #tblRibbonGrpFrameSize img,
#txTemplateDesignerContainer #tblRibbonGrpFrameProps img {
	margin-right: 5px;
}

#txTemplateDesignerContainer #tblRibbonGrpFrameProps input {
	width: 80px;
}