:root {
  --default-font-size: 12px;
  --small-font-size: 0.92em;
  --large-font-size: 1.166em;
}

body {
    font-family: Roboto, Arial, Helvetica, sans-serif;
    color: black;
    font-size: var(--default-font-size);
    padding: 0px;
    margin: 0px;
    background-color: #F0F0F0;
}

a:link, a:active, a:visited {
    color: blue;
    text-decoration: none;
}

a:hover {
    color: red;
    text-decoration: underline;
}

div.pageHeaderWrapper { 
    background: white; 
    padding: 4px; 
    padding-left: 12px;
}

div.pageHeaderTitle { 
    float: left; 
    font-size: var(--small-font-size); 
    color: #555; /* for light bg */
}

div.pageHeaderUserLinks { 
    float: right; 
    font-size: var(--small-font-size); 
    padding-top: 2px;
    color: #a1a5a9;
}


div.pageFooterOuterWrapper {
    border-top: 1px solid black;
}
div.pageFooterInnerWrapper { 
    padding: 4px; 
    padding-top: 8px;
    padding-left: 12px;

    box-shadow: inset 0px 7px 9px -7px rgba(0, 0, 0, 0.4);
    padding-bottom: 20px; 
}
div.pageFooter { 
    background-color: #F0F0F0;
    color: #666;
    font-size: var(--small-font-size);
}

div.pageFooter a, 
div.pageFooter a:visited,
div.pageFooter a:link  
 { 
    text-decoration: underline;
    color: #666;
}

div.pageFooter a:hover { 
    color: blue;
}

  

div.pageContentsWrapper {
    background-color: white;
    padding: 8px;
    padding-top: 3px;
    padding-bottom: 30px;
    min-height: 400px;
}

.stdPage div.pageContentsWrapper {
    box-shadow: inset 0px 7px 9px -7px rgba(0, 0, 0, 0.4);
    padding-top: 8px;
}

.sidebarPage div.pageContentsWrapper {
    padding: 0px;
}
.sidebarTable {  }
.sidebarLeftCell {
    width: 80%;
    padding-top: 8px;
    padding-bottom: 8px;
    box-shadow: inset 0px 7px 9px -7px rgba(0, 0, 0, 0.4);
}
.sidebarLeftCellWrapperDiv {
    height: 100%;       
    padding: 8px;
}      
.sidebarRightCell {
    height: 100%;        
    border-top: none;
    padding-left: 0px;
    background-color: #F0F0F0;
    box-shadow: inset 7px 7px 9px -7px rgba(0, 0, 0, 0.4);
    border-left: 1px solid black;
}

.sidebarRightCellWrapperDiv {
    padding-top: 0px;
}
.sidebarRightCellContentsDiv {
    padding: 10px;
    min-height: 380px;
}

  
div.breadCrumbsOuterWrapper {
    border-top: 1px solid #ccc;
    border-bottom: 0px solid #e1e5e9;
    margin-bottom: 0px;
    padding-bottom: 0px;
    border-bottom: 1px solid black;
    background: linear-gradient(180deg, #e9e9e9, #f9f9f9, #fcfcfc);
}

div.breadCrumbsInnerWrapper {
    color: #666;
    border-top: 1px solid #FFFFFF;
    border-bottom: 1px solid #eee;
    padding: 0px;
    padding-top: 4px;
    padding-bottom: 5px;
    margin-top: 0px;
}

div.breadCrumbs {
    padding: 2px;
    font-size: var(--default-font-size);
    padding-left: 12px;
    padding-top: 2px;
    padding-bottom: 1px;
}
span.breadCrumbs-youAreHere {
    display: none;
}

span.breadCrumbs-arrow {
    font-weight: normal;
    color: black;
    display: none;
}

span.breadCrumbs-sep {
    padding-right: 4px;
    color: #999;
}

a.breadCrumb-menu, 
a.breadCrumb-menu:hover,
a.breadCrumb-menu:active,
a.breadCrumb-menu:visited { 
    cursor: pointer;
    text-decoration: none;
    color: black;
}


span.breadCrumb { 
    color: black;
    padding-left: 0px;
    padding-right: 5px;
}
span.breadCrumbs-sep {
      padding-right: 4px;
}

span.breadCrumbs-parent {
    
}

span.breadCrumbs-current {
    color: black;
}

  

div.dataListHeading {
    font-size: var(--large-font-size);
    font-weight: bold;
    color: #444;
    background-color: #F9F9F9;
    padding: 5px;
    border-bottom: 2px solid #AA8;
    border-right: 1px solid #ccc;
}

div.dataListHeading .title {
    font-weight: normal;
    color: #444;
}

div.dataListFooter {
    font-size: var(--large-font-size);
    font-weight: bold;
    color: #444;
    background-color: #F9F9F9;
    padding: 5px;
    border-top: 2px solid #AA8;
    border-right: 1px solid #ccc;
}

div.dataListFooter .title {
    font-weight: bold;
    color: #444;
}


table.dataList {
    empty-cells: show;
    font-size: var(--default-font-size);
    border: 1px solid #ccc;
}

table.dataList td{
    border-bottom: 1px solid white;
    border-top: 1px solid #ccc;
}


table.dataList tr.dataListFirstRow td.label,
table.dataList tr.dataListFirstRow td.data {
    border-top: none;
}
table.dataList tr.dataListLastRow td.label,
table.dataList tr.dataListLastRow td.data {
}

table.dataList td.label {
    padding: 0px;
    font-weight: bold;
    vertical-align: top;
    text-align: right;
}

table.dataList div.dataListLabel {
    padding-top: 2px;
    padding-right: 3px;
    padding-bottom: 3px;
    padding-left: 3px;
    border-top: 1px solid white;
    border-left: 1px solid white;
}

table.dataList td.data {
    padding: 0px;
    border-left: 1px solid #d1d5d9;
    border-left: none;
    vertical-align: top;
}

table.dataList div.dataListData {
    padding-top: 2px;
    padding-left: 10px;
    padding-bottom: 3px;
    padding-right: 3px;
    border-top: 1px solid white;
    border-right: 1px solid white;
    color: #333;
}

td.dataListEvenLabel, td.dataListEvenData {
    background-color: #f3f3f3;
}

  
.loading_placeholder {
  display: none;
}

body.loading {
  table.dataTable, .dataTablePagingHeader, .dataTablePagingFooter, .boxWrapper {
    display: none;
  }
  .loading_placeholder { display: block; }
}


table.dataTable {
    width: 99%;
    empty-cells: show;
    background-color: white;
    padding-left: 0px;
    padding-right: 0px;
    border-top: 1px solid #b1b5b9;
    border-left: 1px solid #b1b5b9;
    border-right: 1px solid #414549;
    border-bottom: 1px solid #414549;
}
table.dataTable th {
    color: black;
    font-weight: bold;
    border-top: 1px solid #FFFFFF;
    border-right: 1px solid #ccc;
    border-left: none;
    padding: 0px;

    border-bottom: 1px solid black;
    padding: 3px 7px;
    background: linear-gradient(180deg, #e9e9e9, #f9f9f9, #fcfcfc);
}
table.dataTable th a, 
table.dataTable th a:hover,
table.dataTable th a:active,
table.dataTable th a:visited {
    color: black;
    text-decoration: none;
    cursor: n-resize;
}
table.dataTable th.sortable {
    cursor: n-resize;
}
table.dataTable th.sortable {
    height: 100%;
}
table.dataTable th.sortable div.sortableMouseOver{
    background: #E0E0E0;
}
table.dataTable th.sortable:hover, th.sortableMouseOver{
    background-color: #E0E0E0;
}

table.dataTable td {
    font-size: var(--small-font-size);
    padding: 3px;
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-top: 1px solid #ccc;
    vertical-align: top;
}

table.dataTable td:last-child {
    border-right: 1px solid #FFFFFF;
}
table.dataTable tr:nth-child(even) td {
    border-top: 1px solid #FFFFFF;
    border-bottom: 1px solid #FFFFFF;
}
table.dataTable tr:nth-child(even) {
    background-color: #f2f2f2;
}
tr.highlightedRow td, tr.selectedRow td  {
    background-color: #E5ECF9;
    cursor: pointer;
}
table.dataTable tr:first-child td {
    padding-top: 7px;
    border-top: none;
}
table.dataTable tr:last-child td {
    border-bottom: 1px solid #FFFFFF;
}
table.dataTable tr:only-child td {
    padding-top: 7px;
    border-top: 0px solid white;
    border-bottom: 1px solid #FFFFFF;
}
div.dataTablePagingHeader {
    font-size: var(--large-font-size);
    margin-top: 5px;
    color: #444;
    padding: 5px;
}
div.dataTablePagingHeader .title {
    font-weight: normal;
    color: #444;
}

div.dataTablePagingFooter {
    font-size: var(--default-font-size);
    color: #444;
    padding: 5px;
}
div.dataTablePagingHeader a.arrow,
div.dataTablePagingFooter a.arrow  {
  color: black;
}

  
.ticketOverviewOuterWrapper {
   padding: 10px;
   width: 90%;
   max-width: 1100px;
}

div.ticketOverviewIdAndActions {
   font-size: var(--default-font-size);
}

.ticketOverviewIdAndActions div {
   padding: 1px; /* seems to be required for proper rendering of the float containment */
}

.ticketOverviewInnerWrapper {
   margin: 0px;
   padding: 0px;

   border: 1px solid #b1b5b9;
   border-bottom: 1px solid #414549;
   border-right: 1px solid #414549;
}

.ticketOverview {

    padding: 0px;

    border-top: 1px solid #FFFFFF;
    border-right: 1px solid #FFFFFF;
    border-left: 1px solid #FFFFFF;
    border-bottom: 1px solid #F0F0F0;
}

.ticketOverview span.label
{
   color: #333;
   font-weight: bold;
   font-size: var(--default-font-size);
}

span.attachmentDate
{
   color: #666;
   font-weight: normal;
   font-size: var(--small-font-size);
}

span.ticketTypeLabel, 
span.ticketIdLabel
{
   color: #444;
   font-weight: normal;
   font-size: var(--small-font-size);
}

.ticketTitleWrapper {
   background: linear-gradient(180deg, #e9e9e9, #f9f9f9, #fcfcfc);
   padding: 3px 4px;
}

.ticketTitle {
    padding: 1px;
    color: #333;
    background: none;
    font-weight: normal;
}

div.ticketTitle span.label {
    font-size: var(--default-font-size);
}
div.ticketTitle span.ticketTitleContent {
    font-size: var(--large-font-size);
    font-weight: normal;
}

div.ticketHeaderLineWrapper {
    border-top: 1px solid #999;
}

div.ticketHeaderLine {
    padding: 1px 4px;
    padding-bottom: 2px;
    border-top: 1px solid #FFFFFF;

    background-color: #F0F0F0;

    color: #666;
}

div.ticketMiniHistoryOpened {
    float: left;
}

div.ticketMiniHistoryLastUpdated {
    float: right;
}


.ticketMiniHistory td {
}

div.ticketMetadataItem {
    float: left;
    padding-right: 8px;
    padding-left: 8px;
    border-left: 1px solid #999;
}

div#ticketMetadataType {
    padding-left: 0px;
    border-left: none;
}

div#ticketMetadataCategory {
    border-left: none;
    padding-left: 0px;
}

div#ticketMetadataAssignment {
    border-left: none;
    float: right;
    padding-right: 0px;
    padding-left: 0px;
}

.ticketAttachments ul
{ 
    margin-top: 0px;
    margin-bottom: 0px;
    padding-top: 2px;
    padding-bottom: 2px;
    background: white;
}


span.attachmentImage {
    padding-right: 10px;
}


.ticketDetails {
    padding: 10px;
    background-color: #FFFFFF
}        
.ticketDetails span.emptyDetails
{
   font-weight: normal;
   font-size: var(--small-font-size);
}

.ticketDetails, 
.ticketAttachments, 
.ticketHistory
{
    border-top: 1px dashed red;
    border-top: 0px dashed #DDD;
    background-color: white;
    padding: 5px;
}

.ticketHistoryOuterWrapper
{
    padding: 0px;
    background-color: white;
}

.ticketHistoryOuterWrapper .ticketHistoryInnerWrapper
{
    background-color: white;
    padding: 10px;   
    border: 0px;
}

.ticketHistoryOuterWrapper .ticketHistoryEventHeader
{
    display: inline-block;
    background-color: #FCFCFC;
    color: #999;
    padding: 2px 4px;
    margin-bottom: 5px;
}

.ticketHistoryOuterWrapper .ticketHistoryEventDetails
{
    padding: 10px;
    padding-top: 0px;
    background-color: white;
}

.ticketOverviewOuterWrapper.restrictedView .nonCommentEvent {
    display: none;
}

.ticketHistoryOuterWrapper #commentsOnlyLink {
    background-color: #E0E0E0;
}

.ticketSearchformInnerWrapper {
    width: 90%;
    border-top: 1px solid #FFFFFF;
    border-left: 1px solid #FFFFFF;

    padding: 10px;
    background: #F0F0F0;
}

#ticketSearchFormId {
    margin-bottom: 10px;

}

  

.left {
    float: left;
    display: inline; /* fixes ie double margin-left bug */
}

.clear { 
    clear: both;
    overflow: hidden;
    width: 1px;
    height: 1px;
    margin: 0 -1px -1px 0;
    border: 0;
    padding: 0;
    font-size: 0;
    line-height: 0;
}

.futurePlaceholder {
  float: left;
  width: 200px;
}

.htmlSpinner {
  width: 30px;
  height: 30px;
  margin: 10px auto;
  border: 4px solid #bbb;
  border-top:4px solid #eee;
  border-radius: 50%;
}

.htmlSpinner {
  transition-property: transform;
  animation-name: rotate; 
  animation-duration: 1.2s; 
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}
@keyframes rotate {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}

span.isDemo {
    color: red;
    font-weight: bold;
}

.activeLetter {
    color: red;
    font-weight: bold;
    padding: 2px;
    font-size: 130%;
}

.formOuterWrapper {
    border-top: 1px solid #b1b5b9;
    border-left: 1px solid #b1b5b9;
    border-right: 1px solid #414549;
    border-bottom: 1px solid #414549;
    padding: 0px;
    background: #fff;
    background: #F0F0F0;
    width: fit-content;
}

.formInnerWrapper {
    border-top: 1px solid #FFFFFF;
    border-left: 1px solid #FFFFFF;

    padding: 10px;
    background: #F0F0F0;
}


.boxWrapper {
    width: 275px;
    border-top: 1px solid #b1b5b9;
    border-left: 1px solid #b1b5b9;
    border-bottom: 1px solid #414549;
    border-right: 1px solid #414549;
    padding: 0px;
    background: #fff;
    box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.1);
}

.boxHeader {
    padding: 5px;
    font-size: var(--large-font-size);
    border-top: 1px solid #FFFFFF;
    background-color: #F0F0F0;
    border-bottom: 1px solid black;
    background: linear-gradient(180deg, #e9e9e9, #f9f9f9, #fcfcfc);
}

.boxContent {
    box-shadow: inset 0px 7px 9px -7px rgba(0, 0, 0, 0.4);
    background-color: white;
    padding: 3px;
    padding-top: 7px;
}

div.mainFeedbackMessage, div.mainFeedbackMessage p {
    color: red;
    font-size: var(--large-font-size);
    font-weight: bold;
    padding-top: 10px;
    padding-bottom: 10px;
}

span.moneyNeg {
    color: red;
}

span.yes {
    color: green;
}
span.no {
    color: red;
}

.postItNote {
    border-top: 1px solid #c1c5c9;
    box-shadow: 4px 4px 9px 1px rgba(0, 0, 0, 0.15);
    margin-bottom: 15px;
    border: 0;
    padding: 0;
}
.postItNoteBody {
    padding: 5px;
    margin: 0px;
    border-top: 1px solid #c1c5c9;
    border-left: 1px solid #c1c5c9;
    border-right: 1px solid #717579;
    border-bottom: 1px solid #717579;
    background-color: #ffffdd;
}

.requiredLinkFeedback {
      color:red;
}

.sidebarRightCellContentsDiv li,
.boxContent li {
	background-repeat: no-repeat;
	background-position: 0 3px;
	padding-left: 2px;

	list-style: none;
	margin-left: -15px;
	line-height: 1.5em;
}

 

.error {
       color: red;
}


input::placeholder {
  color: #ccc;
  font-weight: lighter;
}

form.formLibForm {
	font-size: var(--default-font-size);
}

form.formLibForm input, 
form.formLibForm select 
{
	font-size: var(--default-font-size);
}

form.formLibForm input[type=submit], 
form.formLibForm input[type=button]
 {
    color: black;
    font-size: var(--default-font-size);
    padding: 2px;
    cursor: pointer;
}

form.formLibForm input[type=text], 
form.formLibForm INPUT[type=text], 
form.formLibForm input[type=password], 
form.formLibForm INPUT[type=password], 
form.formLibForm textarea { 
    padding: 3px;
    font-size: var(--default-font-size);
}

input.readOnlyField, .readOnlyField {
    background-color: transparent !important;
    border-style: none !important;
}

.formFieldTable {
    margin-top: 3px;
    margin-bottom: 3px;
}

.fieldOptionalLabel {
    font-weight: lighter;
    color: #444;
}

.fieldRequiredLabel {
    font-weight: bold;
    color: #111;
}

.fieldLabel.above {
    padding-left: 10px;
}

.fieldLabel.onLeft {
    width: 180px;
    text-align: right;
    padding-right: 10px;
    border-right: 1px solid #d1d1d1;
}

div.requiredField .fieldLabel.onLeft {
    border-right: 1px solid #333;
}

.fieldWidget {
    padding-left: 10px;
    vertical-align: middle;
}


div.fieldInstructions {
    padding-top: 4px;
    font-size: var(--small-font-size);
    font-weight: normal;
    color: #999;
}

div.fieldExample {
    padding-top: 4px;
    font-size: var(--small-font-size);
    font-weight: normal;
    color: #999;
}

div.fieldFeedback {
    padding-top: 4px;
    padding-bottom: 6px;
    color: red;
    font-weight: bold;
}

div.fieldWithFeedback .fieldLabel.onLeft {
    border-right: 2px solid red !important;
}

div.fieldWithFeedback textarea {
    border: 2px solid red;
}

div.fieldWithFeedback .fieldWidget.labelAbove input, 
div.fieldWithFeedback .fieldWidget.labelAbove select {
    border-bottom: 2px solid red;
}


div.formSection {
    padding-top: 5px;
    text-align: left;
    margin-bottom: 5px;
}

div.formSection {
    padding-top: 5px;
    text-align: left;
    margin-bottom: 15px;
}

div.formSectionHeading {
    font-size: var(--large-font-size);
    font-weight: bold;
    color: #444;
    background-color: #F9F9F9;
    padding: 5px;
    border-bottom: 2px solid #AA8;
    border-right: 1px solid #e1e1e1;
    border-left: 1px solid #e1e1e1;
    border-top: 1px solid #e1e1e1;
}

span.formSectionTitle {
    font-size: var(--large-font-size);
    font-weight: bold;
}

span.formSectionDescription {

}

span.formSectionDescription a, span.formSectionDescription a:visited{

}

span.formSectionDescription a:hover, span.formSectionDescription a:active {

}

div.formSectionContents {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid #e1e1e1;
    border-top: 0px solid #ccc;
}


div.formSubmitButton {
    text-align: center;
    text-align: right;
    /* different style than on the Consumer site */
}
.subForm .subFormFields {
  display: block;
  margin-top: 3px;
}
.subFormFields {
	border-top: 2px inset #999999;
	border-left: 2px inset #999999;
	border-bottom: 2px inset white;
	border-right: 2px inset white;
	padding: 0px;
	padding-top: 5px;
	padding-bottom: 5px;
}

.subFormFields .fieldLabel.onLeft {
    width: 110px;
}


.cpYearNavigation,.cpMonthNavigation { 
    background-color: #C0C0C0; 
    text-align:center; 
    vertical-align: middle; 
    text-decoration:none; 
    color:#000000; 
    font-weight:bold; 
}

.cpDayColumnHeader,.cpYearNavigation,.cpMonthNavigation,.cpCurrentMonthDate,
.cpCurrentMonthDateDisabled,.cpOtherMonthDate,.cpOtherMonthDateDisabled,
.cpCurrentDate,.cpCurrentDateDisabled,.cpTodayText,.cpTodayTextDisabled,.cpText
{ 
    font-family:arial; 
    font-size:8pt;
}

td.cpDayColumnHeader { 
    text-align:right; 
    border:solid thin #C0C0C0;
    border-width:0px 0px 1px 0px;
}
.cpCurrentMonthDate,.cpOtherMonthDate,.cpCurrentDate { 
    text-align:right; 
    text-decoration:none; 
}
.cpCurrentMonthDateDisabled,.cpOtherMonthDateDisabled,.cpCurrentDateDisabled { 
    color:#D0D0D0; 
    text-align:right; 
    text-decoration:line-through; 
}
a.cpCurrentMonthDate, a.cpCurrentMonthDate:link, a.cpCurrentMonthDate:visited, 
a.cpCurrentDate, a.cpCurrentDate:link, a.cpCurrentDate:visited { 
    color:#000000; 
}
a.cpOtherMonthDate, a.cpOtherMonthDate:link, a.cpOtherMonthDate:visited { 
    color:#808080; 
}
td.cpCurrentDate { 
    color:white; 
    background-color: #C0C0C0; 
    border-width:1px; 
    border:solid thin #800000; 
}
td.cpCurrentDateDisabled { 
    border-width:1px; 
    border:solid thin #FFAAAA; 
}
td.cpTodayText,td.cpTodayTextDisabled { 
    border:solid thin #C0C0C0; 
    border-width:1px 0px 0px 0px;
}
a.cpTodayText,span.cpTodayTextDisabled { 
    height:20px; 
}
a.cpTodayText { 
    color:black; 
}

a.cpTodayTextDisabled:link, a.cpTodayTextDisabled:active,
a.cpTodayTextDisabled:visited, .cpTodayTextDisabled { 
    /* color:#D0D0D0; */
    color:#a0a0a0; 
}
.cpBorder { 
    border:solid thin #808080; 
}

body#loginPage { 
    background-color: #F6F6F6;
}

body#loginPage div.loginHeaderWrapper {
    text-align: center;
    width: 100%;
}
body#loginPage .loginHeaderContents {
    text-align: center;
    border-bottom: 1px solid #BEBEBE;
    font-size: var(--large-font-size);
    color: #444444;
}

body#loginPage div.loginFormContainerDiv {
    margin-bottom: 25px;
}
body#loginPage div.login_username
{
    margin-top: 20px;
    margin-bottom: 10px;
}

body#loginPage div.login_password
{
    margin-bottom: 10px;
    margin-bottom: 20px;
}

body#loginPage label {
    font-weight: normal;
    font-size: var(--large-font-size);
    padding-right: 10px;
}


@font-face {
  font-family: 'Code128';
  src: url('/_stylesheets/ds/LibreBarcode128-Regular.ttf');
}
div.code128 {
  font-family: 'Code128';
  font-size: 80px;
  transform: scaleX(0.45);
  display: inline-block;
  height: 50px;
  margin: 5px -110px; 
  white-space: nowrap;
}

@media screen and (pointer: coarse) and (orientation: portrait) {
  body.mobile {
    --default-font-size: 22px;
    --large-font-size: 23px;
    --small-font-size: 20px;
  }
  select {
    max-width: 150px;
  }
}





body.demo div.pageContentsWrapper{
    background-image: url(/_graphics/demo.gif);
}
body.demo div.sidebarLeftCellWrapperDiv {
    background-image: url(/_graphics/demo.gif);
}

.demoBackground {
    background-image: url(/_graphics/demo.gif);
}

.dentalleSiteTitle {
    font-weight: normal;
    font-size: var(--large-font-size);
    padding-bottom: 3px;
}

body#loginPage {
    background-color: #FFFFFF;
    padding-top: 120px;
}

body#loginPage input {
    border: 1px solid black;
    background-color: white;
    padding: 2px;
}

body#loginPage input[type=submit],
form.formLibForm input[type=submit],
form.formLibForm input[type=button],
a.buttonStyle,
input[type=submit],
input[type=button] {
    font-size: var(--large-font-size);

    border-top: 1px solid #C4CCCC;
    border-left: 1px solid #C4CCCC;
    border-bottom: 1px solid #3C4444;
    border-right: 1px solid #3C4444;

    background: linear-gradient(0deg, #e9e9e9, #f9f9f9, #fcfcfc);
    box-shadow: rgba(228, 228, 228, .5) 0 0 3px 2px;

    border-radius: 3px;
    padding: 4px;
}
body#loginPage input {
    font-size: var(--large-font-size);
}
body#loginPage input[type=submit] {
    padding-left: 12px;
    padding-right: 12px;
    color: black;
}
body#loginPage input[type=submit]:hover,
form.formLibForm input[type=submit]:hover,
form.formLibForm input[type=button]:hover,
input[type=submit]:hover,
input[type=button]:hover {
      border: 1px solid black;
}

a.buttonStyle,
a.buttonStyle:hover,
a.buttonStyle:active,
a.buttonStyle:visited {
    color: black;
    line-height: 110%;
    text-decoration: none;
    text-align: center;
    margin: 5px;
    padding: 5px;
}

div.pageHeaderWrapper {
   color: black;
   background: white;
   border-bottom: 1px solid #ccc;
   border-bottom: none;
}
.pageHeaderTitle {
  color: black;
  font-size: var(--large-font-size);
}

div.pageHeaderTitle {  color: #333;  }
div.pageHeaderUserLinks {  color: black; }

div.pageHeaderUserLinks a,
div.pageHeaderUserLinks a:hover,
div.pageHeaderUserLinks a:active,
div.pageHeaderUserLinks a:visited {
    color: blue;
}
.dentalleSiteTitle {

}
.accountIdHeader {
    padding-left: 4px;
    padding-right: 4px;
    font-size: var(--small-font-size);
    color: #aaa;
}



.requiredCrownFields {
}
.optionalCrownFields {
    margin-top: 5px;
    border: 1px solid #ccc;
    background-color: #F0F0F0;
    padding: 5px;
}

#crownRxClickInstructions {
    font-weight: bold;
    color: red;
}

span.crownRxInitialClickInstructions {
    font-weight: bold;
    font-size: 14px;
    color: red;
}


#specialinstructions_fieldWrapperDiv {
}

#crown_setwrapper {
    display: none;
}
#bridge_setwrapper {
    display: none;
}
#template_setwrapper {
    display: none;
}

#tempResinShadeWrapper {
    display: none;
}

#saverx_fieldWrapperDiv  {
    display: none;
}

#crownRxTeethSets  {
    display: none;
}


.toothUnitTypeFieldWrapper {
    float: left;
    padding-right: 5px;
    padding-bottom: 5px;
    min-width: 160px;
    height: 28px;
}

.ponticDesignTypeWrapper {
    display: none;
}

.crownRxForm .formFieldWrapper {
    font-size: 12px !important;
}

.crownRxTeethShort {
    color: #666;
}


.formOuterWrapper {
    border-top: 1px solid #b1b5b9;
    border-left: 1px solid #b1b5b9;
    border-right: 1px solid #414549;
    border-bottom: 1px solid #414549;
    padding: 0px;
    background: #fff;
    background: #F0F0F0;

}

.formInnerWrapper {
    border-top: 1px solid #FFFFFF;
    border-left: 1px solid #FFFFFF;

    padding: 10px;
    background: #F0F0F0;
}

form#OrderSearchForm table td.onLeft  {
  width: 8em;
}

form#ShipmentSearchForm table td.onLeft  {
  width: 8em;
}


div.commercialInvoice span.subTitle {
    font-size: 14px;
    color: #aaa;
}
div.commercialInvoiceBox {
    float: left;
    border: 1px solid #ccc;
    padding: 3px;
}

table.commercialInvoiceDetails {
    border-collapse: collapse;
    text-align: left;
    width: 95%;
    margin-bottom: 15px;
}
table.commercialInvoiceDetails th,
table.commercialInvoiceDetails td {
    border: 1px solid #ccc;
    padding: 3px;
}

table.commercialInvoiceAddress {
    text-align: left;
    width: 70%;
    margin-bottom: 15px;
}

table.commercialInvoiceAddress td {
    padding: 10px;
    border: 1px solid #ccc;
}

table.commercialInvoiceItems {
    text-align: left;
    width: 95%;
    margin-top: 30px;
    margin-bottom: 30px;
    border-collapse: collapse;
}
table.commercialInvoiceItems td,
table.commercialInvoiceItems th {
    border: 1px solid #ccc;
    padding: 3px;
}

table.commercialInvoiceItems tr.totalsRow td {
    border-top: 2px solid #aaa;
    font-weight: bold;
}

table.commercialInvoiceSignature {
    margin-top: 30px;
}

table.commercialInvoiceSignature td.requiresFilling {
  background-color: yellow;
  border-width: 0px 0px 1px 0px;
  border-bottom: 1px solid black;
  padding-right: 25px;
  height: 30px;
}


.rxChineseTranslation {
    font-weight: bold;
    font-size: 14px;
    color: black;
    background-color: #fffff5;
    margin: 1px;
    line-height: 19px;
    padding: 1px;
}

.replacedRx {
    background-color: #efefef;
    padding: 5px;
    border: 1px dotted black;
    margin-top: 5px;
    margin-bottom: 5px;
}

.isVipOrder, .isTrialOrder {
    color: red;
    font-size: 120%;
    font-weight: bold;
}

.remakeRequired {
    color: red;
}
.cannotManufacture {
    font-weight: bold;
    color: red;
}

.rxOverviewTable {
    font-size: 12px;
}
.rxOverviewTable th {
    padding: 2px;
    border: 1px solid #ededed;
    font-weight: bold;
}

.rxOverviewTable td {
    padding: 2px;
    border: 1px solid #ededed;
    vertical-align: top;
}

.pontic {
    padding: 0 3px 0 3px;
    color: white;
    background-color: #333;
}

.internalLabNotes {
    width: 400px;
    font-weight: normal;
    background-color: #ccc;
    border: 1px solid black;
    padding: 2px;
}

span.toothNumber {
    font-size: 110%;
}

.toothSetTable {
   font-size: 11px;
   margin-left: 30px;
}
.toothSetTable td {
    padding: 2px;
    border-bottom: 1px solid #dcdcdc;
}

.toothSetTable td.label {
    border-right: 1px solid #ededed;
    padding-left: 2px;
}

span.rxLabel {
    color: #666;
}

.toothSetTable td.value {
    font-weight: normal;
    padding-left: 5px;
}

.toothSetTable td.value span.field_label {
    display:none;
}

.chinaVersion .toothSetTable td.label {
    display: none;
}

.chinaVersion td.value span.field_label {
    font-weight: normal;
    display: inline;
    color: #777;
}
.chinaVersion td.value span.field_value {
    font-size: 13px;
}

.chinaVersion td.value span.field_label {
    display: none;
}

.chinaVersion tr.restoration_type td.value {
    font-weight: bold;
}
.chinaVersion tr.workflow__is_metal_tryin td.value span.field_label {
    display: inline;
}

.chinaVersion tr.workflow__is_bisque_bake td.value span.field_label {
    display: inline;
}

.chinaVersion tr.workflow__is_zirconia_try_in td.value span.field_label {
    display: inline;
}

.chinaVersion tr.use_wire_enforcement td.value span.field_label {
    display: inline;
}

.chinaVersion div.tryinStep2 tr.workflow__is_metal_tryin td.value {
    display: none;
}
.chinaVersion div.tryinStep2 tr.workflow__is_zirconia_try_in td.value {
    display: none;
}

.chinaVersion tr.workflow__fit_to_partial_denture td.value span.field_label {
    display: inline;
}

.chinaVersion tr.extra__request_implant_work td.value span.field_label {
    display: inline;
}

.chinaVersion tr.extra__additional_items_sent td.value span.field_label {
    display: inline;
}


.chinaVersion tr.OcclusalStainingType_type td.value span.field_label {
    display: inline;
}
.chinaVersion tr.PostOnlyMetalType_type td.value span.field_label {
    display: inline;
}
.chinaVersion tr.BuildupAlloyType_type td.value span.field_label {
    display: inline;
}

.metal-tryin-flag {
    margin-top: 20px;
    font-size: 150%; 
    font-weight: bold; 
    color: red;
}
.internalLabNotes {
   display: none;
}
.chinaVersion .internalLabNotes {
    padding: 10px;
   display: block;
}

.chinaVersion tr.bool_type td.value{
    color: red;
}

div.crown tr.pontic_design {
    display: none;
}

.toothSetTable .shadeType {
    font-weight: bold;
    font-size: 110%;
}

.toothSetTable .shadeTypeValue {
    font-weight: normal;
    font-size: 110%;
}

table.shadeTable td {
    border-bottom: none;
}

.toothSetTable tr.specialInstructions,  
.toothSetTable tr.instructions {
    background-color: black;
    color: white;
    font-weight: normal;
}

.toothSetTable tr.doctorsPrefs {
    background-color: #ccc;
    color: black;
    font-weight: normal;
    padding-bottom: 20px;
}


table.crownScriptOptions {
   font-size: 11px;
   width: 98%;
   border: 2px solid black;
   padding: 5px;
   margin-left: 5px;
}

table.crownScriptOptions td.data {
  padding: 2px 4px;
  margin: 0px;
  width: 3em;
}

table.crownScriptOptions td.label {
  padding: 2px 4px;
  width: 12em;
}

span.typeId {
  color: #ccc;
}

@media print {
  * {
    box-shadow: none !important;
  } 
  html {
    margin: 0;
  }
  body {
    background-color: white !important;
  }
  div.breadCrumbsOuterWrapper,
  .unprintable,
  .fakePageBreak,
  .sidebarRightCell,
  .postItNote,
  .formOuterWrapper,
  .formInnerWrapper,
  .mainFeedbackMessage,
  div.pageHeaderWrapper,
  div.breadCrumbs,
  div.pageFooterOuterWrapper,
  div.instructions {
    display: none;
  }
  .printable {
    display: block;
  }
  div.commercialInvoice {
    font-size: 11px !important;
  }
  div.printable {
    margin: 0px;
    padding: 0px;
    border-width: 0px;
    font-size: 11px !important;
  }
  div.printable td,
  div.printable th {
    font-size: 11px !important;
  }
  .pageBreak,
  .pageBreak.printable,
  .printable.pageBreak {
    page-break-before: always;
  }
  .printable.noPageBreak {
    page-break-before: auto;
  }

  span.isDemo {
      font-size: 150%;
  }
  div.pageContentsWrapper {
      padding: 0px;
      margin: 0px;
  }
  tr.fcz-material td {
      font-size: 25px !important;
  }
}

@media screen {
  .pageBreak {
    margin-top: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    border-top: 4px dashed grey;
  }
  .fakePageBreak {
    margin-top: 10px;
    margin-bottom: 10px;
    border-top: 4px dashed grey;
  }
}

table.invoiceItems {
  border-collapse: collapse;
}

table.invoiceItems thead th {
  text-align: left;
  padding: 1px 4px;
  border-left: 1px solid #cccccc;
}
table.invoiceItems thead th.amount {
  text-align: right;
}
table.invoiceItems thead tr th:first-child {
  border-left-width: 0px;
}

table.invoiceItems thead tr th.blank {
  border-left-width: 0px;
}

table.invoiceItems tfoot tr:first-child td,
table.invoiceItems tfoot tr:first-child th {
  border-top: 2px solid #666666;
}

table.invoiceItems tfoot tr td.blank {
  border-width: 0px;
}
table.invoiceItems tfoot tr th {
  border-right: 1px solid #cccccc;
  padding: 1px 4px;
  text-align: right;
  border-top: 1px solid #cccccc;
}
table.invoiceItems tfoot tr td {
  padding: 0px 4px;
  text-align: right;
  border-top: 1px solid #cccccc;
}

table.invoiceItems tbody tr td {
  border-top: 1px solid #cccccc;
  padding: 1px 4px;
  border-left: 1px solid #cccccc;
  vertical-align: top;
}
table.invoiceItems tbody tr:first-child td {
  border-top: 2px solid #666666;
}

table.invoiceItems tbody tr td.blank {
  border-left-width: 0px;
}

table.invoiceItems tbody tr td:first-child {
  border-left-width: 0px;
}
table.invoiceItems tbody tr td.amount {
  text-align: right;
  width: 8em;
}
table.invoiceItems tbody tr td.quantity {
  text-align: right;
  width: 6em;
}


table.selectOrders .orderSummary {
  margin-top: 5px;
  border: 1px solid #666666;
  padding: 2px 4px;
}

table.selectOrders .buttons {
  float: right;
  padding: 5px;

}

table.selectOrders #optionsList .removeButton {
  display: none;

}

table.selectOrders #selectedList .removeButton {
  display: inline;

}

table.selectOrders #optionsList .addButton {
  display: inline;

}

table.selectOrders #selectedList .addButton {
  display: none;

}


table.selectItems .itemSummary {
  margin-top: 5px;
  border: 1px solid #666666;
  padding: 2px 4px;
}

table.selectItems .buttons {
  padding: 5px;

}

table.selectItems #unselectedList .removeButton,
table.selectItems #optionsList .removeButton {
  display: none;

}

table.selectItems #selectedList .removeButton {
  display: inline;

}

table.selectItems #unselectedList .addButton,
table.selectItems #optionsList .addButton {
  display: inline;
}

table.selectItems #selectedList .addButton {
  display: none;

}

table.shipping_estimates_calendar thead td {
    color: #666;
    font-weight: bold;
    border-bottom: 1px solid black;
    padding-right: 8px
}
table.shipping_estimates_calendar tbody td {
    color: #333;
    font-family: monospace;
    border-bottom: 1px solid #ddd;
    padding-right: 8px
}
table.shipping_estimates_calendar tbody td.shipped {
    border-right: 1px solid #ddd;
}

div.customerInfoBox {
  margin-right: 10px;
  margin-bottom: 10px;
}

div.stats {
 margin-right: 10px;
 margin-bottom: 10px;
}

div.stats table.dataList {
}
div.stats table.dataList td.label {
  width: auto;
  padding: 1px 2px;
  text-align: right;
}

div.stats table.dataList td.label a {
  font-weight: normal;
}

div.stats table.dataList td.data {
  width: auto;
  padding: 1px 2px;
  text-align: left;
}

div.stats table.dataList tr:last-child td {
  border-bottom-width: 0px;
}

a span.previousDate,
a:active span.previousDate,
a:visited span.previousDate  {
  color: black;
  font-style: italic;
}

div.stats span.statsOrders {
  width: 20px;
  color: blue;
}

div.stats table.dataTable {
  border: none;
}

div.stats table.dataTable td {
  width: auto;
  padding: 0px 6px;
  text-align: left;
}

div.stats table.dataTable td:first-child {
  text-align: right;
  border-left: none;
}

div.stats table.dataTable tr:nth-child(even) {
    background-color: #F6F6F6;
}

div.orgNotesWrapper {
    padding-top: 0px;
    padding-left: 10px;
    padding-right: 10px;
}

div.orgNoteOuterWrapper {
    margin: 5px;
    padding-bottom: 25px;
}

div.orgNoteOuterWrapper {
}
div.orgNoteInnerWrapper {
    border: 1px solid #628636;
}


div.orgNoteOuterWrapper_even {
}

div.orgNoteOuterWrapper_odd {

}

div.orgNoteInnerWrapper_even {
    border: 1px solid #628636;
    background-image: none;
}

div.orgNoteInnerWrapper_odd {
    border: 1px solid #D78807;
    background-image: none;
}


div.childNotes {
    padding-left: 55px;
}

div.orgNote {
}

div.orgNoteHeader {
    color: #777; 
    padding-left: 5px;
}
div.orgNoteTitle .author {
    text-decoration: none;
    font-style: italic;
    font-weight: bold;

}

div.orgNoteTitle .wrote {
    text-decoration: none;
    font-style: italic;
    color: #D78707;
    font-weight: normal;
}

div.orgNoteTitle .wrote.even {
    color: #628636;
    background: none;
}

div.orgNoteTitle {
    background-color: #FCFAF0;
    border-bottom: 1px solid #E2E4CE;
    margin: 5px;
    padding: 4px;
    padding-top: 1px;

    color: #222;
    font-weight: bold;

}
div.orgNote div.orgNote div.orgNoteTitle {
}

div.orgNoteTitle a,
div.orgNoteTitle a:active,
div.orgNoteTitle a:visited {
    color: #222;
    text-decoration: none;
}


.orgNoteOrgLink {
    padding-left: 5px;
}

div.orgNoteHeader a,
div.orgNoteHeader a:active,
div.orgNoteHeader a:visited {
    color: #777;
    text-decoration: underline;
}

div.orgNoteHeader a:hover {
    color: blue;
}

div.orgNoteContent {
    padding-left: 5px;

    padding-bottom: 5px;
}

div.ticketEventsListing {
    padding-top: 0px;
    padding-left: 10px;
    padding-right: 10px;
}

.ticketEventsListing .ticketEventWrapper {
    padding: 5px;
    border: 1px solid #999;
    margin: 5px;
    margin-bottom: 20px;
}

.ticketEventsListing .ticketEventWrapper .ticketEventHeader {
    margin-bottom: 10px;
}

.ticketEventHeader .when {
}

.ticketEventHeader .ticketSummary {
    color: #444;
    background-color: #f2f2f2;
    border: 1px solid #ccc;
    padding: 5px;
}
.ticketEventHeader .ticketSummary .title {
    font-weight: bold;
}

.ticketEventHeader .ticketEventSummary {
    color: #333;
}

div.organizationNoteHeader {
    color: #777; 
    padding-left: 5px;
}

.ticketEventsListing .ticketEventDetails {
    padding-left: 5px;
}


.requiresFilling,
table td.requiresFilling {
  border: 3px solid black;
  background-color: yellow;
}


#OrderStatusForm td.onLeft {
  width: 70px;
}

.overLib {
}

.ticketOrderOverview {
    margin: 4px;
    padding: 3px;
    border: 1px solid grey;
    float: right;
}

input.priceRuleQty {
    font-weight: bold;
    color: red;
}

#priceRuleQtxForm .fieldLabel.onLeft {
    border: none !important;
    width: 400px;
}


.invoicePrepFormWrapperTable {
    width: 100%;
}

.invoicePrepTable .fieldLabel {
    border: none !important;
}
.invoicePrepTable .fieldWidget {
    border: none !important;
}

.invoicePrepTableRowCell {
    padding: 10px;
}

table.invoicePrepTable tr {
    background-color: white;
}

table.invoicePrepTable tr:nth-child(even) {
    background-color: #f2f2f2;
}


table.labPriceList td {
    text-align: center;
}

table.labPriceList td.label {
    width: 230px;
    text-align: left;
    font-weight: bold;
}

table.labPriceList td.qty {
    font-weight: bold;
}

table.labPriceList td {
    border-bottom: 1px solid #e0e0e0;
}



div.menuBox {
  margin-right: 10px;
  margin-bottom: 10px;
}


div.pdmenu {
    padding: 25px;
    padding-left: 0px;
    padding-top: 0px;
    font-size: var(--default-font-size);
    font-weight: normal;
}

.pdmenu ul {
    margin: 0;
    padding: 0 0 25px 0;
    list-style-type: none;
}

.pdmenu li  {
	margin: 0 -1px 0 0;
	padding: 0;
	text-decoration: none;
}
.pdmenu li.pdmenu1  {
	width: 140px;
	margin: 0 -1px 0 0;
	padding: 0;

	border: 1px solid #333;
        font-size: var(--large-font-size);
	color: black;
	text-decoration: none;
	background-color: white;
	float: left;
}

.pdmenu a {
	text-decoration: none;
	display: block;
	cursor:	pointer;
}

.pdmenu a.pdmenu1 {
	text-decoration: none;
	display: block;
	color: #000000;
	background-color: #ffffff;
	padding: 5px;
}


.pdmenu a.pdmenu1:hover {
	text-decoration: none;
}

.pdmenu a.pdmenu1
{
    color: #fff;
    background-color: #6b6c78;
    border-top: solid 1px #8f909b;
    border-left: solid 1px #8f909b;
    border-bottom: solid 1px #565764;
    border-right: solid 1px #565764;
    padding: 5px 5px 5px 10px;
}
.pdmenu a.pdmenu1:hover,
.pdmenu a.pdmenu1.active {
	color: #fff !important;
	background-color: #b30738;
	border-top: solid 1px #d62255;
	border-left: solid 1px #d62255;
	border-bottom: solid 1px #88052b;
	border-right: solid 1px #88052b;
}

.pdmenu li ul {
	display: none;
}

.pdmenu li:hover ul,
.pdmenu li.submenuActive ul {
	visibility: visible;
	display: block;
	position: absolute;
	z-index: 1;
	padding: 0;
	margin: 0;
	margin: 1px -1px 0 -1px;
	background-color: transparent;
}

li.pdmenu2 {
    border: none;
    float: none;
    width: 165px;
    margin: 0 -1px 0 0;
    clear: both;
    font-size: var(--small-font-size);
}

li.pdmenu2 a,
li.pdmenu2 a:link,
li.pdmenu2 a:visited,
li.pdmenu2 a:active {
    display: block;
    color: #fff;
    background-color: #6b6c78;
    border-top: solid 1px #8f909b;
    border-left: solid 1px #8f909b;
    border-bottom: solid 1px #565764;
    border-right: solid 1px #565764;
    padding: 5px 5px 5px 10px;
    width: 165px;
}

li.pdmenu2:hover a.pdmenu2,
li.pdmenu2 a:hover {
	color: #fff !important;
	background-color: #b30738;
	border-top: solid 1px #d62255;
	border-left: solid 1px #d62255;
	border-bottom: solid 1px #88052b;
	border-right: solid 1px #88052b;
}

.pdmenu li ul.pdmenu3 {
	display: none;
	float: right;
	width: 220px;
	padding: 0px;
	margin-top: 0px;
	position: absolute;
	z-index: 2;
}
html>body .pdmenu li ul.pdmenu3 {
  margin-left: 182px;
}

.pdmenu a.pdmenu2.hasSubmenu {
	float: left;
}
.pdmenu li.pdmenu2.hasSubmenu {
	margin-bottom: -2px;
}

li.pdmenu2:hover ul.pdmenu3,
li.pdmenu2.submenuActive ul.pdmenu3,
li.pdmenu2SubmenuActive ul.pdmenu3,
ul.pdmenu3.active {
	display: block;
}

a.pdmenu3,
a.pdmenu3:link,
a.pdmenu3:visited,
a.pdmenu3:active {
	background-color: #b30738;
}
li.pdmenu3 a.pdmenu3 {
	width: 220px;
}

li.pdmenu3  {
	position: relative;
	z-index: 2;
	padding: 0;
	background-color: #6b6c78;
	width: 220px;
	font-size: var(--small-font-size);
}

@media screen and (pointer: coarse) and (orientation: portrait) {
  body.mobile div.pdmenu {
    --default-font-size: 18px;
    --large-font-size: 20px;
    --small-font-size: 16px;
  }
  body#loginPage.mobile {
    --default-font-size: 24px;
    --large-font-size: 26px;
    --small-font-size: 18px;
  }
  body#loginPage input[type=text]:focus-visible,
  body#loginPage input[type=password]:focus-visible {
    outline: 1px solid red;
  }
  body#loginPage div.login_username,
  body#loginPage div.login_password
  {
      margin: 15px;
  }
  
}