/*// SURVEY STYLES v1.0 //*/
:root {
    /*// CONTAINERS //*/
        --survey-background: #e9e9e9;
        --container-background-color: #ffffff;
    /*// TYPOGRAPHY //*/
        /*// Main Heading //*/
        --main-heading-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, 'San Francisco', Helvetica, 'Helvetica Neue', 'Tahoma', Arial, sans-serif;
        --main-heading-font-color: #000000;
        --main-heading-font-size: 34px;
        --main-heading-font-weight: bold;
        --main-heading-font-style: normal;
        --main-heading-text-decoration: none;
        --main-heading-line-height: 44px;
        --main-heading-text-alignment: center;
        /*// Sub Heading //*/
        --sub-heading-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, 'San Francisco', Helvetica, 'Helvetica Neue', 'Tahoma', Arial, sans-serif;
        --sub-heading-font-color: #000000;
        --sub-heading-font-size: 24px;
        --sub-heading-font-weight: bold;
        --sub-heading-font-style: normal;
        --sub-heading-text-decoration: none;
        --sub-heading-line-height: 28px;
        --sub-heading-text-alignment: left;    
        /*// Main Paragraph //*/         
        --paragraph-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, 'San Francisco', Helvetica, 'Helvetica Neue', 'Tahoma', Arial, sans-serif;
        --paragraph-font-color: #000000;
        --paragraph-font-size: 18px;
        --paragraph-font-weight: normal;
        --paragraph-line-height: 26px;
        --paragraph-text-alignment: left;
        /*// Questions //*/         
        --question-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, 'San Francisco', Helvetica, 'Helvetica Neue', 'Tahoma', Arial, sans-serif;
        --questions-font-color: #000000;
        --question-font-size: 18px;
        --question-font-weight: normal;
        --question-line-height: 26px;
        /*// Question Subtext //*/         
        --question-subtext-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, 'San Francisco', Helvetica, 'Helvetica Neue', 'Tahoma', Arial, sans-serif;
        --question-subtext-font-color: #000000;
        --question-subtext-font-size: 14px;
        --question-subtext-font-weight: normal;
        --question-subtext-font-style: italic;    
        --question-subtext-line-height: 26px;
        /*// Answers //*/         
        --answer-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, 'San Francisco', Helvetica, 'Helvetica Neue', 'Tahoma', Arial, sans-serif;
        --answer-font-color: #000000;
        --answer-font-size: 18px;
        --answer-font-weight: normal;
        --answer-line-height: 26px;
    /*// BUTTONS //*/
        /*// Primary //*/      
        --button-primary-color: #0E52B9;
        --button-primary-border-color: #0E52B9;
        --button-primary-text-color: #ffffff;
        --button-primary-hover-color: #0b5ed7;
        --button-primary-hover-border-color: #0a58ca;
        /*// Secondary //*/  
        --button-secondary-color: #ffffff;
        --button-secondary-border-color: #6c757d;
        --button-secondary-text-color: #ffffff;
        --button-secondary-hover-color: #6c757d;;
        --button-secondary-hover-border-color: #6c757d;
        --button-secondary-color: #6c757d;
    
    
        --radio-button-scale-outline: #ced4da;
    }
    
    body {
        background: var(--survey-background);
    }
    
    
    .survey-heading {
        font-family: var(--main-heading-font-family);
        font-size: var(--main-heading-font-size);
        font-weight: var(--main-heading-font-weight);
        color: var(--main-heading-font-color);
        line-height: var(--main-heading-line-height);
        text-align: var(--main-heading-text-alignment);
        margin: 10px 0 20px 0;
    }
    
    .survey-sub-heading {
        font-family: var(--sub-heading-font-family);
        font-size: var(--sub-heading-font-size);
        font-weight: var(--sub-heading-font-weight);
        color: var(--sub-heading-font-color);
        line-height: var(--sub-heading-line-height);
        text-align: var(--sub-heading-text-alignment);
    }
    
    .survey-paragraph {
        font-family: var(--paragraph-font-family);
        color:var(--paragraph-font-color);
        font-size:var(--paragraph-font-size);
        font-weight:var(--paragraph-font-weight);
        line-height:var(--paragraph-line-height);
        text-align:var(--paragraph-text-alignment);
    }
    
    .survey-paragraph pre{
        font-family: var(--paragraph-font-family);
        color:var(--paragraph-font-color);
        font-size:var(--paragraph-font-size);
        font-weight:var(--paragraph-font-weight);
        line-height:var(--paragraph-line-height);
        text-align:var(--paragraph-text-alignment);
    }
    
    .survey-question {
        font-family: var(--question-font-family);
        color:var(--questions-font-color);
        font-size:var(--question-font-size);
        font-weight:var(--question-font-weight);
        line-height:var(--question-line-height);
    }
    
    .survey-question pre{
        font-family: var(--question-font-family);
        color:var(--questions-font-color);
        font-size:var(--question-font-size);
        font-weight:var(--question-font-weight);
        line-height:var(--question-line-height);
    }
    
    .question-subtext {
        font-family: var(--question-subtext-font-family);
        color:var(--question-subtext-font-color);
        font-size:var(--question-subtext-font-size);
        font-style: var(--question-subtext-font-style);
        font-weight:var(--question-subtext-font-weight);
        line-height:var(--question-subtext-line-height);
        margin: 0 0 10px;
    }
    
    .form-check,
    .form-select {
        font-family: var(--answer-font-family);
        color:var(--answer-font-color);
        font-size:var(--answer-font-size);
        font-weight:var(--answer-font-weight);
        line-height:var(--answer-line-height);
    }
    
    .btn-primary {
        background-color: var(--button-primary-color);
        color:var(--button-primary-text-color);
        border-color: var(--button-primary-border-color);
    }
    
    .btn-primary:hover,
    .btn-primary:active {
        background-color: var(--button-primary-hover-color);
        color:var(--button-primary-text-color);
        border-color: var(--button-primary-hover-border-color);
    }
    
    .btn-outline-primary:hover,
    .btn-check:checked + .btn-outline-primary,
    .btn-outline-primary-active,
    btn-outline-primary:active,
    .btn-outline-primary.dropdown-toggle.show
     {
        background-color: var(--button-primary-color);
        color:var(--button-primary-text-color);
        border-color: var(--button-primary-hover-border-color);
    }
    
    .btn-secondary {
        background-color: var(--button-secondary-color);
        color:var(--button-secondary-color);
        border-color:var(--button-secondary-color);
    }
    
    .survey-component-container {
        margin: 5px 0 40px 0;
        padding: 10px 15px;
        border-radius: 5px;
    }

    .survey-component-container > label {
        display: block;
    }

    .survey-component-container > label[questype="short"],
    .survey-component-container > label[questype="long"],
    .survey-component-container > label[questype="dropdown"]
     {
        margin-bottom: 10px;
    }

    
    .form-select {
        width: auto;
        font-size: 16px;
    }
    
    .rating-button {
        border-color:#6c757d;
        color: #6c757d;
        padding: 15px 20px;
    }
    
    #contact-form-container {
        margin: 40px 0px;
    }
    #contact-form-container .row {
        margin: 20px 0;
    }
    
    #survey-submit-button,
    #survey-reset-button {
        padding: 10px 20px;
        margin: 0 5px;
    }
    
    .required_ques {
        color: #b60000;
        margin-left: 5px;
    }
    pre {
        margin: 0;
    }
    #img_header {
        text-align: center; 
        margin: auto; 
        font-size: 16px; 
        padding-top: 10px; 
        font-weight: bold;
    }

    #address_validate_txt {
        color:#006600; 
        font-family: var(--paragraph-family);
        font-size: 12pt; 
        margin-top:10px; 
        line-height: 18px; 
        text-align:center;
        padding: 10px 20px;
    }
    
    #messageHolder {
        FONT-WEIGHT: normal; 
        FONT-SIZE: 10pt; 
        FONT-FAMILY: var(--paragraph-family); 
        COLOR: #b60000;
        margin: 10px 40px;
        padding: 5px;

    }
    
    #info_div {
        margin:auto;
    }
    
    #info_div div.controls {
        font-family: var(--paragraph-family);
        font-size: 16px;
        margin-top: 10px; 
        border:1px solid #CCC; 
        border-radius: 5px;
    }
    
    #survey_main_form {
        max-width: 820px;
        background-color: rgb(255, 255, 255); 
        padding-top: 20px;
        padding-bottom: 20px; 
        margin:40px auto;  
    }
    #questions {
        margin-top: 10px;
        padding: 10px 2.1rem 20px 2.1rem;
    }
    .ques_answer_div {
        text-align: left; 
        margin-top: 5px; 
    }
    
    #submit_div
     {
        padding: 10px 30px 20px 30px;
    }
    
    .other-question-subtext {
        margin-top: 1rem;
        width: 100%;
    }

    /*// Moved embedded styles //*/

    .nobannerheader {
		width: 300px;
		font-weight: bold;
		font-size: 20px;
		margin: auto;
		text-align: center;
		margin-bottom: 40px;
	}
	
	#title-label {
		text-align: center;
		text-decoration: underline;
		font-size: 14px;
	}
	
	pre {
		overflow-x: auto;
		white-space: pre-wrap;
		white-space: -moz-pre-wrap;
		white-space: -pre-wrap;
		white-space: -o-pre-wrap;
		word-wrap: break-word;
	}
	
	.ui-widget-header {
		border: 1px solid #aaaaaa;
		background: #cccccc url(images/ui-bg_highlight-soft_75_cccccc_1x100.png) 50% 50% repeat-x;
		color: #222222;
		font-weight: bold;
	}
	
	.sortable {
		cursor: default !important;
	}

    #info_div input,
    select {
       
        border: 1px solid #CCC;
        border-radius: 4px;
        vertical-align: middle;
        font-size: 16px;
    }
    
    .form-control {
        font-size: 16px;
    }
    
    table {
        FONT-SIZE: 10pt;
        FONT-FAMILY: Arial, Helvetica, sans-serif;;
        COLOR: #2a415d;
        margin-left: 30px;
        border: 1px double #CCC;
        border-radius: 4px;
        margin-bottom: 30px;
    }
    
    tr td:first-child {
        text-align: right;
    }
    
    .red {
        color: #b60000;
    }
    
    .row {
        margin-top: 5px;
    }
    /*// //*/

    
    
    .rating-button {
        min-width: 60px;
    }
    
    .btn-group>.btn-group:not(:first-child)>.btn, .btn-group>.btn:nth-child(n+3), .btn-group>:not(.btn-check)+.btn {
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
        margin: 4px 4px;
    }
    .btn-group>.btn-group:not(:last-child)>.btn, .btn-group>.btn:not(:last-child):not(.dropdown-toggle) {
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
        margin: 4px 4px;
    }
    
    .btn-group {
        flex-wrap: wrap;
        justify-content: flex-start;
        
    }
    
    btn-group-vertical>.btn, .btn-group>.btn {
        flex: 0 1 auto;
    }
    
    #submit_div input[value='Submit'] { 
        font-size: 18px;
        padding: 10px 20px;
        text-align: center;
    }
    
    @media screen and (max-width: 819px){
        
        #no_img_header {
            padding-left: 5px;
            padding-right: 5px;
        }
        
        #messageHolder { 
            margin: 10px 25px;
        }
        
        #questions {
            margin-top: 10px;
            padding: 10px 1.2rem 20px 1.2rem;
        }
        
        .form-select {
            width: 100%;
        }
        
         #survey_main_form {
            margin: 0 auto;
        }
    
    
         #submit_div input[value='Submit'] {
            width: 96%;
        }
        
    
    }