/***************************************** FORM SETTINGS START HERE ****************************************/
/* Date: 2024.10.18 | Version: 1.1 */

/* Hide top navigation, footer, information section and right navigation */
.page-top,
.page-head,
.page-footer,
.infoSection,
.workflowRightTab,
.workflowHeadingTitle {
    display: none !important;
}

/* Page background */
html,
body {
    background-color: rgba(28, 109, 178, 1) !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Main workflow area */
#workflow-wrapper,
#divWorkflowContent,
.page-content {
    background-color: rgba(28, 109, 178, 1) !important;
    padding: 5px 0 !important;
    margin: 0 !important;
    min-height: 533px !important;
}

/* Main form container */
#workflow-background-wrapper,
div#workflow-background-wrapper {
    float: none !important;
    width: 99% !important;
    max-width: 99% !important;
    min-width: 0 !important;
    margin: 0 auto !important;

    border-right: none !important;
    border-radius: 5px !important;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2) !important;
}

/* Center the form */
#workflow-wrapper:not(.embed):not(.registered-embed) {
    justify-content: center !important;
}

/* Desktop screens */
@media screen and (min-width: 1500px) and (max-width: 1540px) {
    #workflow-background-wrapper {
        width: calc(100% - 10px) !important;
        max-width: calc(100% - 10px) !important;
        min-width: 0 !important;
        margin: 0 auto !important;
    }
}
/* Tablet screens */
@media screen and (min-width: 1300px) and (max-width: 1500px) {
    #workflow-background-wrapper {
        width: 99% !important;
        max-width: 99% !important;
    }
}

/* Mobile screens */
@media screen and (max-width: 700px) {
    #workflow-wrapper,
    #divWorkflowContent,
    .page-content {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    #workflow-background-wrapper {
        width: 100% !important;
        max-width: 100% !important;
        border-radius: 0 !important;
    }
}

body div.page-content {
    width: 70% !important;
    max-width: 70% !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
}

body div.page-content div.inner {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}
/***************************************** FORM SETTINGS END HERE ******************************************/

 /*Hide print button - This block of code will hide the print button , use this as per form specific requirements */


/***************************************** FORM FIELD SETTINGS START HERE *************************************/

 /*Main Heading or Title of the Form */
.dhsHeading {
    vertical-align: top !important;
    font-size: 20px; 
    font-weight: bold;   
    text-align: center;  
}

/*SubHeading */
.dhsSubHeading1 {
    vertical-align: top !important;
    font-size: 16px; 
    font-weight: bold;  
    text-align: center;

}

/*SubHeading */
.dhsSubHeading2 {
    vertical-align: top !important;
    font-size: 14px;  
    font-weight: bold; 
    text-align: center;

}

/*Instructions in the title area - Style Italic */
.dhsInstructions1 {
    vertical-align: top !important;
    font-size: 14px;
    font-weight: bold;  
    font-style: italic;  
    text-align: justify;

}

/*Instructions in the title area - Style Normal */
.dhsInstructions2 {
    vertical-align: top !important;
    font-size: 14px;
    font-weight: bold;  
    font-style: normal;  
    text-align: justify;

}

/* Instructions under the Title area */
.dhsInstructions3 {
    vertical-align: top !important;
    font-size: 14px; 
    text-align: justify;  

}

/* Form field Labels Styles - Applies Automatically to form field labels only  */
.form-label {
   font-weight: bold; 
  
}


/* Heading form field Styles - Applies Automatically to Section Headings */
.new_html_field,
.recordForm .formFieldWrapper.heading-wrapper h3,
.workflowContent .formFieldWrapper.heading-wrapper h3,
.form-element-wrapper[data-type="heading"]
  .heading-label-wrapper
  .editable-text,
.form-element-wrapper[data-type="heading"] .heading-label-wrapper input,
.page-content .workflowContent .formFieldWrapper.heading-wrapper h3 {
  color: rgba(46, 116, 181, 1) !important;
  border-color: rgba(46, 116, 181, 1) !important;
  font-size: 20px; 
  font-weight: bold; 
  
}

#justForPadding > div > div.page-top.padding-bottom-0
{
display:none
}

/***************************************** FORM FIELD SETTINGS END HERE *************************************/

/* ---------- Form Fields ------ */

.form-static-html form-item table, th, tr, td {
   border: solid;
   border: single;
   padding-left: 5px;
   padding-right: 5px;
}

.dhsTable th, tr, td {
   padding-left: 5px;
   padding-right: 5px;
   border-color: white;
   align-content : center;
}


.rounded-box {
    /* Set the light grey background */
    background-color: #f0f0f0; 
    
    /* Set a 2px solid light grey border */
    border: 2px solid #d3d3d3; 
    
    /* Round the corners by 12 pixels */
    border-radius: 12px; 
    
    /* Add padding so content doesn't touch the borders */
    padding: 20px;   
    

    justify-content: center;     /* Centers horizontally */
    align-items: center;      
 
  }

.rounded-box1 {
       
    /* Set a 2px solid light grey border */
    border: 2px solid #d3d3d3; 
    
    /* Round the corners by 12 pixels */
    border-radius: 12px; 
    
    /* Add padding so content doesn't touch the borders */
    padding: 5px;   
    

    justify-content: center;     /* Centers horizontally */
    align-items: center;      
 
  }



.formFieldWrapper .align-block {
  vertical-align: top;
}

.formFieldWrapper.heading-wrapper {
    font-size: 20px !important;
    line-height: 1.3 !important;
    padding-top: 0px;
}

 #form-element-wrapper_29, #form-element-wrapper_357, #form-element-wrapper_36, #form-element-wrapper_109, #form-element-wrapper_111, #form-element-wrapper_120, #form-element-wrapper_122, #form-element-wrapper_172, #form-element-wrapper_450, #form-element-wrapper_36, #form-element-wrapper_51{
			width: 66% !important;
			min-width:66% !important;
			
		}
 #form-element-wrapper_383,  #form-element-wrapper_382, #form-element-326, #form-element-wrapper_110, #form-element-wrapper_394, #form-element-wrapper_121, #form-element-wrapper_395, #form-element-wrapper_386, #form-element-wrapper_451, #form-element-wrapper_409, #form-element-wrapper_392, #form-element-wrapper_689, #form-element-wrapper_692, #form-element-wrapper_693, #form-element-wrapper_694, #form-element-wrapper_695, #form-element-wrapper_696{
			width: 30% !important;
			min-width:30% !important;
			
		}
.formFieldWrapper .radio-checkbox-label, .form-element-wrapper .radio-checkbox-label 
{
    white-space: nowrap;
}

 #form-element-wrapper_464,  #form-element-wrapper_463, #form-element-wrapper_462, #form-element-wrapper_294, #form-element-wrapper_293{
			width: 60% !important;
			min-width:60% !important;
			
		}

.item-wrapper {
 display: flex; flex-direction: column-reverse;
 	padding-bottom: 5px;
	 }

.formFieldWrapper.container-wrapper {

    border: 1px solid #cccccc !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    padding: 5px 25px !important;
    box-sizing: border-box !important;
}

#form-element-wrapper_418,
#form-element-wrapper_419, #form-element-wrapper_420,  #form-element-wrapper_503, #form-element-wrapper_516, #form-element-wrapper_543, #form-element-wrapper_688{
    visibility: hidden !important;
    height: 0px !important;
    min-height: 0px !important;
    margin: 0 !important;
    padding: 0 !important;
}


#form-element-wrapper_387 .radio-checkbox-label, #form-element-wrapper_388 .radio-checkbox-label, #form-element-wrapper_389 .radio-checkbox-label, #form-element-wrapper_390 .radio-checkbox-label, #form-element-wrapper_457 .radio-checkbox-label,  #form-element-wrapper_597 .radio-checkbox-label,  #form-element-wrapper_548 .radio-checkbox-label{
    white-space: normal !important;
}

#form-element-wrapper_622 {
   white-space: normal; /* default */
   overflow: auto;
}

.no-border-table {
    width: 80%;
    margin: 0 auto;
    border: none !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    background: transparent !important;
}

.no-border-table tr,
.no-border-table td,
.no-border-table th {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

#label-element544, #element544, #label-element643, #element643, #label-element724, #element724, #label-element722, #element722 {
display: none;
}

#form-element-wrapper_647,  #form-element-wrapper_653, #form-element-wrapper_656, #form-element-wrapper_671,  #form-element-wrapper_672, #form-element-wrapper_670, #form-element-wrapper_669,  #form-element-wrapper_667, #form-element-wrapper_668, #form-element-wrapper_666,  #form-element-wrapper_665, #form-element-wrapper_664, #form-element-wrapper_663,  #form-element-wrapper_662, #form-element-wrapper_661, #form-element-wrapper_676, #form-element-wrapper_674, #form-element-wrapper_673, #form-element-wrapper_678, #form-element-wrapper_702{
display: none;
}

#form-element-wrapper_649{

 vertical-align: top;
}

 #form-element-wrapper_425,  #form-element-wrapper_465, #form-element-wrapper_596{
 /* Set a 2px solid light grey border */
    border: 2px solid #d3d3d3; 
    
    /* Round the corners by 12 pixels */
    border-radius: 12px; 
    
    /* Add padding so content doesn't touch the borders */
    padding: 5px;   
    

    justify-content: center;     /* Centers horizontally */
    align-items: center;    
}

.dhstableSupervisors {
    border: 1px solid #ccc;
    border-collapse: separate;
    border-spacing: 0;
}

#form-element-wrapper_705, #form-element-wrapper_708, #form-element-wrapper_709, #form-element-wrapper_707, #form-element-wrapper_706 { 
    width: calc(35% - 5px) !important; 
    min-width: calc(35% - 5px) !important; 
    box-sizing: border-box !important; 
}

/* Put 462 and 705 on the same line */
#form-element-wrapper_462,
#form-element-wrapper_705 {   
    display: inline-block; 
    vertical-align: top !important;
    float: none !important;
    box-sizing: border-box !important;
}

#form-element-wrapper_293,
#form-element-wrapper_706 {   
    display: inline-block; 
    vertical-align: top !important;
    float: none !important;
    box-sizing: border-box !important;
}

#form-element-wrapper_294,
#form-element-wrapper_707 {   
    display: inline-block; 
    vertical-align: top !important;
    float: none !important;
    box-sizing: border-box !important;
}

#form-element-wrapper_463,
#form-element-wrapper_708 {   
    display: inline-block; 
    vertical-align: top !important;
    float: none !important;
    box-sizing: border-box !important;
}

#form-element-wrapper_464,
#form-element-wrapper_709 {   
    display: inline-block; 
    vertical-align: top !important;
    float: none !important;
    box-sizing: border-box !important;
}