/*General CSS*/
.formFieldWrapper .radio-checkbox-label,
.form-element-wrapper .radio-checkbox-label {
    margin: 0px;
}
 
  /* Pulsing Dots */
  .lds-pulse {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    height: 100px;
  }
  
  .lds-pulse div {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    animation: pulse 1.2s ease-in-out infinite;
  }
  
  .lds-pulse div:nth-child(1) {
    background-color: #707272;
    animation-delay: 0s;
  }
  .lds-pulse div:nth-child(2) {
    background-color: #FD7C26;
    animation-delay: 0.2s;
  }
  .lds-pulse div:nth-child(3) {
    background-color: #8981C0;
    animation-delay: 0.4s;
  }
  .lds-pulse div:nth-child(4) {
    background-color: #1BA54E;
    animation-delay: 0.6s;
  }
  
  @keyframes pulse {
    0%, 100% {
      transform: scale(1);
      opacity: 0.6;
    }
    50% {
      transform: scale(1.5);
      opacity: 1;
    }
  }

.loadingPanel {
    top: 0px !important;
}

/* Hides extra space at bottom of page */
div.page-wrap {
    padding-bottom: 0px !important;
}
 
/* put space between bottom of form fields and top of submit button */
.submit-button-wrapper {
    padding-top: 50px!important;
}
 
/* space below submit button */
#formPartialDiv {
    margin-bottom: 0px!important;
}
 
/* make form wide enough to fit 3 fields on one line */
@media screen and (min-width: 1100px) and (max-width: 1340px) {
    #workflow-background-wrapper {
        min-width: 840px!important;
    }
}
 
/* set form width to 94%, override default @media query that sets width to 100% */
@media screen and (min-width: 700px) and (max-width: 1100px) {
    #workflow-background-wrapper {
        width: 94%!important;
    }
}
 
/* get rid of top/bottom padding, form takes up entire screen */
@media screen and (max-width: 700px) {
    #workflow-wrapper {
        padding: none!important;
    }
}
 
.workflowRightTab {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}
 
@media screen and (max-width: 1340px) and (min-width: 1100px) {}
 
#workflow-wrapper:not(.embed):not(.registered-embed) {
    justify-content: center;
}

/* 1. LINE AT TOP - WORKFLOW NAME AND EXIT WORKFLOW BUTTON - DEFAULT SHOWS---------------------------------------------------------------------------------------------------------- */
/* turn off title, header/footer, info, summary/attachments/communications sections */
.infoSection,
.workflowRightTab {
    display: none!important;
}

/* 3 Background Color --------------------------------------------------------------------------------------------------------------------------*/
/* in case of anonymous access */
html, body {
    background-color: #188E8B!important;
}

/* add background color and padding so that it's visible above/below form */
#workflow-wrapper,
#divWorkflowContent,
.page-content {
    background-color: #188E8B!important;
    padding: 50px 0px!important;
    min-height: 400px !important;
}

/* OOTB Header Fields*/
h3 {
    font-weight: bold!important;
    border-color: #188E8B!important;
    font-size: 24px!important;
    border-bottom-width: 5px!important;
}

/* add hover effect to submit/save/section buttons */
.form-save-button:hover,
.form-reset-button:hover,
.form-print-button:hover,
.form-change-section:hover,
.form-collaboration-stage-submit-button:hover,
.form-submit-button:hover,
#divWorkflowContent:hover .buttonPopup.blue:hover {
    box-shadow: 0 0 0 5px rgba(9, 41, 64, .2);
}

/* center form, get rid of line on right border, add shadow */
#workflow-background-wrapper {
    float: none !important;
    margin: auto !important;
    border-right: none !important;
    box-shadow: 0px 0px 10px 10px rgba(0,0,0,0.2)!important;
}

div#workflow-background-wrapper {
    margin:0 auto !important;
	background-color: white!important;
	border-radius: 5px !important;
	border-color: rgb(0 0 0 / 13%)!important;
	box-shadow: 4px 7px 10px 3px rgb(0 0 0 / 13%) !important;
	padding: 10px !important;
}

/* Read only elements. Add more when necessary */
#element2 {
	border-color: #FFF!important;
}

input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"]:not(.select2-search__field), input[type="tel"], input[type="time"], input[type="url"], textarea, select {
    /*font: 1em/1em 'Verdana','Helvetica','Arial',sans-serif;*/
    border: 1px solid #ccc;
    background-color: #fafafa;
    display: inline-block;
    height: 40px;
    outline: 0 none;
    padding: 0.3em 0.57143em;
    -webkit-border-radius: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 8px !important;
}

.section-breadcrumb-item.active {
    border-bottom: 5px solid #188E8B!important;
}

.regexErrorLabel {
    font-size: 14px!important;
    font-weight: bold!important;
}