/* DynamicGoogleForm Class Styles */

/* defaults */

    .dgf-form-wrapper, .dgf-form-wrapper * {
        box-sizing: border-box;
    }
    
    .dgf-form-wrapper h3 {
        color: #23282d;
    }
    
    .dgf-form-wrapper button {
        cursor: pointer;
        font-family: inherit;
    }

    .dgf-form-wrapper button:focus {
        outline: none;
    }
    
    .dgf-form-wrapper button.gfb-disable {
        cursor: default;
    }
    
/* end of defaults */

/* button */

    .dgf-button {
        background-color: #fff !important;
        border: none;
        border-radius: 4px;
        box-shadow: 0 0 10px 5px rgba(0,0,0,0.04);
        text-align: center;
        width: 100%;
        display: inline-block;
        padding: 15px 10px;
        color: #2F4255 !important;
        font-weight: 600;
        font-size: 12px;
        transition: background-color 0.6s, color 0.6s, box-shadow 0.6s;        
    }
    
    .dgf-button:hover {
        background-color: #4484f4 !important;
        color: #fff !important;
    }
    
    .dgf-button:focus {
        box-shadow: 0 0 10px 5px rgba(0,0,0,0.08);
    }
    
    .dgf-button.dgf-disabled {
        color: #ccc !important;
        cursor: default;
    }
    
    .dgf-button.dgf-disabled:hover {
        background-color: #fff !important;
        color: #ccc !important;
    }
    
    .dgf-button.dgf-disabled:focus {
        box-shadow: 0 0 10px 5px rgba(0,0,0,0.04);
    }    

/* button */

/* multiple step back button */

    .dgf-multiple-step-back-button {
        position: absolute;
    	left: -100%;
    	top: 50%;
    	z-index: 3;
      	transform: translate(-50%, -50%);
      	-ms-transform: translate(-50%, -50%);	
    	height: 2rem;
    	line-height: 2rem;
    	transition: left 0.6s ease;
    	border: none;
    	background-color: transparent;
    	cursor: pointer;        
    }
    
    .dgf-form-title-container.dgf-for-multiple-step.dgf-active .dgf-multiple-step-back-button {
        left: 34px;
    }
    
    .dgf-back-arrow-icon {
    	position: relative;
    	top: -1px;
    	transition: margin-right 0.3s ease;
    	vertical-align: middle;
    	transform: rotate(-180deg);        
    }
    
    .dgf-back-arrow-icon--g {
    	stroke: #666;
    	transition: stroke 0.3s ease;        
    }
    
    .dgf-multiple-step-back-button:hover .dgf-back-arrow-icon--g {
        stroke: #4484f4;
    }
    
    .dgf-back-arrow-icon--circle {
    	-webkit-transition: stroke-dashoffset .3s ease;
    	transition: stroke-dashoffset .3s ease;
    	stroke-dasharray: 95;
        stroke-dashoffset: 95;        
    }
    
    .dgf-multiple-step-back-button:hover .dgf-back-arrow-icon--circle {
        stroke-dashoffset: 0;
    }

/* end of multiple step back button */

/* multiple step progress bar */

    /* wrapper */
    
        .dgf-progress-bar-wrapper {
            padding: 0 50px 25px;
        }
        
        @media only screen and (max-width: 380px) {
            
        	.dgf-progress-bar-wrapper {
        		padding-left: 30px;
        		padding-right: 30px;
        	}
        	
        }
        
    /* end of wrapper */
    
    /* container */
    
        .dgf-progress-bar-container {
            height: 6px;
            background: #e6e6e6;
            border-radius: 90px;
            overflow: hidden;
            box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.04);            
        }
    
    /* end of container */
    
    /* progress */
    
        .dgf-progress-bar {
            height: 100%;
            border-radius: 90px;
            background-color: #2175FF;
            transition: width 0.6s ease;            
        }
    
    /* end of progress */

/* end of multiple step progress */

/* multiple form's step */

    /* wrapper */
    
        .dgf-steps-container {
            width: 100%;
            position: relative;
            overflow: hidden;
        }
    
    /* end of wrapper */

    /* container */
    
        .dgf-step-container {
            padding: 0px 50px 30px;
            width: 100%;
            position: relative;
            top: 0;
        }
        
        .dgf-step-container.dgf-hide {
            top: -100%;
            position: absolute;
            visibility: hidden;
        }
        
    /* end of container */
    
    /* button container */
    
        .dgf-step-button-container {
            padding-top: 30px;
            width: 100%;
        }
    
    /* end of button container */
    
    /* google recaptcha */
    
        .dgf-step-container .dgf-google-recaptcha-container {
            padding: 30px 0;
            width: 100%;
        }
        
        @media only screen and (max-width: 360px) {
                    
            .dgf-step-container .dgf-google-recaptcha-container {
                padding: 30px 0;
            }
                    
        }    
    
    /* end of google recaptcha */

/* end of multiple form's step */

/* fields */

    /* container */
    
        .dgf-form-fields {
            padding: 0 50px 30px;
            width: 100%;
            position: relative;            
        }
        
        @media only screen and (max-width: 360px) {
            
            .dgf-form-fields {
                padding: 0px 30px 30px;
            }
            
        }
    
    /* end of container */
    
    /* fieldset */
    
        .dgf-fieldset {
            min-width: 100%;
            margin: 0;
            padding: 0;
            border: none;
            position: relative;
        }
        
        .dgf-fieldset.dgf-disabled {
            opacity: 0.6;
            overflow: hidden;
        }
        
        .dgf-fieldset.dgf-overflow-hidden {
            overflow: hidden;
        }
    
    /* fieldset */
    
    /* label */
    
        .dgf-field-label {
    	    font-size: 11px;
    	    font-weight: 400;
    	    display: block;
    	    margin: 5px 0;
    	    color: #2F4255;
    	    transition: opacity 0.6s, color 0.6s;
    	    text-align: left;
    	    opacity: 0.5;
    	    cursor: pointer;	            
        }
        
        .dgf-field-label:hover, .dgf-fieldset.dgf-focus .dgf-field-label {
            opacity: 1;
        }
        
        .dgf-fieldset.dgf-disabled .dgf-field-label, .dgf-fieldset.dgf-disabled .dgf-field-label:hover, .dgf-fieldset.dgf-disabled.dgf-focus .dgf-field-label {
            opacity: 0.5;
            cursor: default;
        }
        
        .dgf-fieldset.dgf-invalid .dgf-field-label {
            color: #ff6666;
            opacity: 1;
        }
        
        .dgf-field-label.dgf-error {
            text-align: right;
            transition: height 0.6s, margin-bottom 0.6s, opacity 0.6s, color 0.6s;
            cursor: default;
        }
        
        .dgf-fieldset.dgf-invalid .dgf-field-label.dgf-error{
            height: 15px;
            margin-bottom: 15px;
        }
    
    /* end of label */
    
    /* checkbox */
    
        .dgf-fieldset input[type=checkbox] {
            position: absolute;
            z-index: -99;
            top: -100%;
        }
        
        .dgf-fieldset input[type=checkbox] + label {
            position: relative;
            padding-left: 40px !important;
            cursor: pointer;
            transition: color 0.6s, border-color 0.6s;
        }
        
        .dgf-fieldset input[type=checkbox]:checked + label {
            border-color: #4484f4;
            color: #4484f4;
        }
        
        .dgf-fieldset.dgf-disabled input[type=checkbox] + label {
            color: #ccc;
            cursor: default;
        }
        
        .dgf-fieldset input[type=checkbox] + label:before {
            content: '';
        	position: absolute;
        	top: 11px;
        	left: 15px;
            background-color: #ddd;
            min-width: 15px;
            height: 15px;
            border: 1px #ccc solid;
            border-radius: 50%;
            transition: background-color ease 0.6s, box-shadow ease 0.6s;
            box-shadow: 0 1px 3px rgba(0,0,0,.13);            
        }
        
        .dgf-fieldset input[type=checkbox] + label:hover:before, .dgf-fieldset input[type=checkbox]:focus + label:before {
            background-color: #bdd7ee;
            border-color: #bdd7ee;            
        }
        
        .dgf-fieldset.dgf-disabled input[type=checkbox] + label:hover:before, .dgf-fieldset.dgf-disabled input[type=checkbox]:focus + label:before {
            background-color: #ddd;
            border-color: #ccc;            
        }        
        
        .dgf-fieldset input[type=checkbox]:checked + label:before, .dgf-fieldset input[type=checkbox]:checked + label:hover:before {
            background-color: #4484f4;
        }
        
    /* end of checkbox */
    
    /* file */
    
        .dgf-fieldset input[type=file] {
            position: absolute;
            z-index: -99;
            top: -100%;
        }
        
        .dgf-fieldset input[type=file] + label {
            text-align: left;
            padding: 20px 15px !important;
            position: relative;
	        cursor: pointer;
	        max-width: 100%;
	        white-space: nowrap;
	        overflow: hidden;
	        text-overflow: ellipsis;
        }
        
        .dgf-fieldset.dgf-active input[type=file] + label {
            color: #4484F4;
            border-color: #4484F4;
        }
        
        .dgf-fieldset.dgf-active.dgf-invalid input[type=file] + label {
            color: #ff6666;
        }
        
        .dgf-fieldset.dgf-disabled input[type=file] + label {
            cursor: default;
            color: #ccc;
        }
        
        .dgf-fieldset input[type=file] + label:before {
            content: 'Choose File';
            margin-right: 15px;
            border-radius: 4px;
            background-color: #4484F4;
            padding: 12px;
            color: #fff;
            font-family: 'Montserrat', sans-serif;
            font-size: 9px;
            box-shadow: 0 1px 3px rgba(0,0,0,.13);
            letter-spacing: 1.5px;
            text-transform: uppercase;
            transition: background-color 0.6s ease;
        }
        
        .dgf-fieldset input[type=file]:focus + label:before, .dgf-fieldset.dgf-invalid input[type=file]:focus + label:before {
            background-color: #4484F4;
        }
        
        .dgf-fieldset.dgf-active input[type=file] + label:before {
            background-color: #0e5feb;
        }
        
        .dgf-fieldset.dgf-disabled input[type=file] + label:before {
            background-color: #b3b3b3;
        }
        
        .dgf-fieldset.dgf-invalid input[type=file] + label:before, .dgf-fieldset.dgf-invalid.dgf-active input[type=file] + label:before {
            background-color: red;
        }
    
    /* end of file */
    
    /* radio button */
    
        .dgf-fieldset input[type=radio] {
            position: absolute;
            z-index: -99;
            top: -100%;
        }
        
        .dgf-fieldset input[type=radio] + label {
            position: relative;
            padding-left: 40px !important;
            cursor: pointer;
            transition: color 0.6s, border-color 0.6s;
        }
        
        .dgf-fieldset input[type=radio]:checked + label {
            border-color: #4484f4;
            color: #4484f4;
        }
        
        .dgf-fieldset.dgf-disabled input[type=radio] + label {
            color: #ccc;
            cursor: default;
        }
        
        .dgf-fieldset input[type=radio] + label:before {
            content: '';
        	position: absolute;
        	top: 11px;
        	left: 15px;
            background-color: #ddd;
            min-width: 15px;
            height: 15px;
            border: 1px #ccc solid;
            border-radius: 50%;
            transition: background-color ease 0.6s, box-shadow ease 0.6s;
            box-shadow: 0 1px 3px rgba(0,0,0,.13);            
        }
        
        .dgf-fieldset input[type=radio] + label:hover:before, .dgf-fieldset input[type=radio]:focus + label:before {
            background-color: #bdd7ee;
            border-color: #bdd7ee;            
        }
        
        .dgf-fieldset.dgf-disabled input[type=radio] + label:hover:before, .dgf-fieldset.dgf-disabled input[type=radio]:focus + label:before {
            background-color: #ddd;
            border-color: #ccc;            
        }
        
        .dgf-fieldset input[type=radio]:checked + label:before, .dgf-fieldset input[type=radio]:checked + label:hover:before {
            background-color: #4484f4;
        }    
    
    /* end of radio button */
    
    /* range slider */
    
        .dgf-fieldset.dgf-invalid .rs-range-progress {
            background-color: #ffb3b3;
        }
        
        .dgf-fieldset.dgf-invalid .rs-range-thumb {
            background-color: #ff6666;
        }
        
        .dgf-fieldset.dgf-invalid .rs-range-label.rs-active {
            color: #ff6666;
        }
        
        .dgf-fieldset.dgf-invalid .rs-range-label:focus {
            color: #ff8080;
        }
        
        .dgf-fieldset.dgf-invalid .rs-range-label.rs-active:before {
            background-color: #ff6666;
        }
        
        .dgf-fieldset.dgf-invalid .rs-range-label:focus:before {
            background-color: #ff8080;
        }
        
        .rs-container {
            margin-top: 17px;
        }
    
    /* end of range slider */
    
    /* scheduler */
    
        .dgf-fieldset.dgf-invalid .date-picker .date-picker-day.date-picker-selected {
            background-color: red;
        }
        
        .dgf-fieldset.dgf-invalid .date-picker .date-picker-time-slot-icon {
            background-color: red;
        }
    
    /* end of scheduler */
    
    /* time picker */
    
        .tp-container {
            margin-top: 11px;
        }
        
        .dgf-fieldset.dgf-invalid .tp-field {
            box-shadow: 0 0 5px #ffdddd;
            border: 1px solid #ffdddd !important;
            background-color: #fdfafa;             
        }
        
        .dgf-fieldset.dgf-invalid .tp-button.tp-selected-ampm {
            border-color: red;
            color: #ff6666 !important;
            transition: color 0.6s, border-color 0.6s, opacity 0.6s;
        }
        
        .dgf-fieldset.dgf-invalid .tp-button.tp-selected-ampm:focus {
            opacity: 0.6;
        }        
        
        .dgf-fieldset.dgf-invalid .tp-button.tp-now {
            background-color: red !important;
            border-color: red;
        }
        
        .dgf-fieldset.dgf-invalid .tp-button.tp-now:focus {
            background-color: #b30000;
            border-color: #b30000;
        }
        
        .dgf-fieldset.dgf-invalid .tp-ampm-options {
            border-color: red;
            color: #ff6666;
        }
    
    /* end of time picker */
    
    .dgf-fieldset .dgf-field, .dgf-fieldset input[type=checkbox] + label, .dgf-fieldset input[type=radio] + label, .dgf-fieldset input[type=file] + label {
    	padding: 10px;
    	border: 1px solid #ccc;
    	display: inline-block;
    	font-size: 12px;
    	margin: 8px 0 0 0;
    	transition: border 0.6s ease, box-shadow 0.6s ease, background-color 0.6s ease;
    	width: 100%;
    	text-overflow: ellipsis;
    	border-radius: 4px;
    	font-family: inherit;
    	line-height: normal;
    }
    
    .dgf-fieldset .dgf-field:focus, .dgf-fieldset input[type=checkbox]:focus + label, .dgf-fieldset input[type=radio]:focus + label, .dgf-fieldset input[type=file]:focus + label {
        outline: none;
		box-shadow: 0 0 5px rgba(0,0,0,0.22) !important;
	    border: 1px solid rgba(0,0,0,0.22) !important;
	    border-bottom: 1px solid rgba(0,0,0,0.22);
	    background-color: #fff;   
    }
    
    .dgf-fieldset.dgf-invalid .dgf-field, .dgf-fieldset.dgf-invalid input[type=checkbox] + label, .dgf-fieldset.dgf-invalid input[type=radio] + label, .dgf-fieldset.dgf-invalid input[type=file] + label {
        box-shadow: 0 0 5px #ffdddd;
        border: 1px solid #ffdddd;
        background-color: #fdfafa;        
    }
    
    .dgf-fieldset.dgf-disabled .dgf-field, .dgf-fieldset.dgf-disabled input[type=checkbox] + label, .dgf-fieldset.dgf-disabled input[type=radio] + label, .dgf-fieldset.dgf-disabled input[type=file] + label {
        background-color: #FCFCFC;
    }

/* end of fields */

/* form wrapper */

    .dgf-form-wrapper {
        font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
        font-size: 13px;
        font-weight: 400;
        padding: 0;
        position: relative;
    }
    
    .dgf-form-wrapper.dgf-contains-form {
        width: fit-content;
        margin: auto;
    }
    
    @media only screen and (max-width: 480px) {
        
        .dgf-form-wrapper.dgf-contains-form {
            width: 100%;
        }
        
    }

/* end of form wrapper */

/* form */

    .dgf-form {
		width: 500px;
		margin: auto;
		position: relative;
		background-color: #fff;
		box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 11px 0px;
		border-radius: 4px;
      	overflow: hidden;
	}
	
	@media only screen and (max-width: 480px) {
	
		.dgf-form {
			width: 90%;
		}
	
	}
	
	@media only screen and (max-width: 360px) {
	
		.dgf-form {
			width: 100%;
		}
	
	}
	
	/* title */
	
	    .dgf-form-title-container {
    		width: 100%;
    		display: flex;
    		flex-direction: row;
    		padding: 10px 20px;
	    }
	    
	    .dgf-form-title-container.dgf-for-multiple-step {
            position: relative;
            overflow: hidden;
            transition: padding-left 0.6s ease;	        
	    }
	    
	    .dgf-form-title-container.dgf-for-multiple-step.dgf-active {
	        padding-left: 60px;
	    }
	    
	    .dgf-form-title-container h3 {
		    font-size: 11px;
		    font-weight: 400;
		    transition: opacity 0.6s;	        
	    }
	    
	    .dgf-form-title-container.dgf-for-multiple-step h3 {
	        margin-top: 14px;
	    }
	
	/* end of title */
	
	/* submit button */
	
	    /* container */
	    
	        .dgf-form-submit-button-container {
	            padding: 0px 50px 30px;
	            width: 100%;
	        }
	        
            @media only screen and (max-width: 360px) {
                
                .dgf-form-submit-button-container {
                    padding: 0px 30px 30px;
                }
                
            }
	    
	    /* end of container */
	
	/* end of submit button */
	
	/* redirect overlay */
	
	    .dgf-redirect-overlay {
	        position: absolute;
	        top: 0;
	        left: 0;
	        width: 100%;
	        height: 100%;
	        z-index: 100;
	        display: flex;
	        flex-direction: column;
	        justify-content: center;
	        align-items: center;
	        background-color: #4484f4;
	        text-align: center;	 
	        transition: top 0.6s;
	    }
	    
	    .dgf-redirect-overlay.dgf-hide {
	        top: -100%;
	    }
	    
	    .dgf-redirect-overlay-content {
            width: 100%;
	    }
	    
	    .dgf-redirect-overlay-content span {
	        display: inline-block;
	        background-color: #fff;
	        vertical-align: middle;
	        width: 50px;
	        height: 50px;
	        border-radius: 50%;
	        line-height: 59px;
	        box-shadow: 0 0 17px 5px rgba(0,0,0,0.2);
	    }
	    
	    .dgf-redirect-overlay-content i {
            display: inline-block;
            transform: rotate(45deg);
            height: 24px;
            width: 14px;
            border-bottom: 7px solid #3E78DE;
            border-right: 7px solid #3E78DE;
	    }
	    
	    .dgf-redirect-overlay-content h3 {
	        font-size: 32px;
	        color: #A2C2FA;
	        font-weight: 300;
	        margin: 15px 0 0 0;
	    }
	    
	    @media only screen and (max-width: 360px) {
	        
	        .dgf-redirect-overlay-content h3 {
	            font-size: 24px;
	        }
	        
	    }
	
	/* end of redirect overlay */

/* end of form */

/* google recaptcha */

    .dgf-google-recaptcha-container {
        padding: 0px 50px 30px;
        width: 100%;
    }
    
    @media only screen and (max-width: 360px) {
                
        .dgf-google-recaptcha-container {
            padding: 0px 30px 30px;
        }
                
    }

/* end of google recaptcha */

/* loader */

    .dgf-form-wrapper .hlmf-loader-wrapper {
        position: absolute;
        z-index: 5;
        background-color: #fff;
        background-color: rgba(241, 241, 241, 0.8);
    }

/* end of loader */

/* alert box */

    /* container */
    
        .dgf-alert-box-container {
            position: absolute;
            width: 100%;
            height: 100%;
            background-color: rgba(255, 255, 255, 0.8);
            top: 0;
            left: 0;
            border-radius: 4px;
            z-index: 6;
            display: flex;
            flex-direction: row;
            justify-content: center;
            align-items: center;            
        }
        
        .dgf-alert-box-container.dgf-hide {
            display: none;
        }
    
    /* end of container */
    
    .dgf-alert-box {
        position: relative;
        animation-name: dgf-animatetop;
        animation-duration: 0.4s;
        width: 350px;
        margin: auto;
        border-radius: 4px;
        background-color: #fff;
        box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 11px 0px;        
    }
    
    @media only screen and (max-width: 480px) {
        
        .dgf-alert-box {
            width: 90%;
        }
        
    }
    
    /* title */
    
        .dgf-alert-box-title-container {
            padding: 10px 16px 0;
        }
        
        .dgf-alert-box-title-container h3 {
            font-weight: 500;
            margin: 0;
            font-size: 11px;
            opacity: 0.4;
        }
    
    /* end of title */
    
    /* message */
    
        .dgf-alert-box-message-container {
            padding: 30px 30px 20px;
            font-size: 12px;
            line-height: 200%;
            color: #2F4255;            
        }
        
        .dgf-alert-box-message-container p {
            margin: 0;
        }
    
    /* message */
    
    /* close button */
    
        .dgf-alert-box-close-button-container {
            padding: 0 30px 30px;
        }
    
    /* end of close button */

/* end of alert box */

/* animations */

	/* load */
	
    	@keyframes dgf-load {
    		0% {right: 0}
    		100% {right: -100%}
    	}

    /* end of load */
    
    /* animiate top */
    
        @keyframes dgf-animatetop {
            from {top: -300px; opacity: 0}
            to {top: 0; opacity: 1}
        }
    
    /* end of animate top */
    
    /* pulse */
    
        @keyframes dgf-pulse {
            0%   {box-shadow: 0 0 0 0 rgba(0,0,0,0.09)}
            50%  {box-shadow: 0 0 0 15px rgba(0,0,0,0.09)}
            100% {box-shadow: 0 0 0 0 rgba(0,0,0,0.09)}
        }
    
    /* end of pulse */
    
    /* fade */
    
        @-webkit-keyframes dgf-fade {
            from {opacity: .4} 
            to {opacity: 1}
        }
        
        @keyframes dgf-fade {
            from {opacity: .4} 
            to {opacity: 1}
        }    
    
    /* end of fade */

/* end of animations */