<calc-builder-front custom="" :data="{&quot;settings&quot;:{&quot;general&quot;:{&quot;header_title&quot;:&quot;Total Summary&quot;,&quot;descriptions&quot;:&quot;show&quot;,&quot;boxStyle&quot;:&quot;vertical&quot;},&quot;currency&quot;:{&quot;currency&quot;:&quot;$&quot;,&quot;num_after_integer&quot;:2,&quot;decimal_separator&quot;:&quot;.&quot;,&quot;thousands_separator&quot;:&quot;,&quot;,&quot;currencyPosition&quot;:&quot;left_with_space&quot;},&quot;formFields&quot;:{&quot;fields&quot;:[],&quot;emailSubject&quot;:&quot;&quot;,&quot;contactFormId&quot;:&quot;&quot;,&quot;accessEmail&quot;:false,&quot;adminEmailAddress&quot;:&quot;&quot;,&quot;submitBtnText&quot;:&quot;Submit&quot;,&quot;allowContactForm&quot;:false,&quot;body&quot;:&quot;Dear sir/madamWe would be very grateful to you if you could provide us the quotation of the following=&gt;Total Summary[ccb-subtotal]Total=&gt; [ccb-total-0]Looking forward to hearing back from you.Thanks in advance&quot;,&quot;payment&quot;:false,&quot;paymentMethod&quot;:&quot;&quot;},&quot;paypal&quot;:{&quot;enable&quot;:false,&quot;description&quot;:&quot;[ccb-total-0]&quot;,&quot;paypal_email&quot;:&quot;&quot;,&quot;currency_code&quot;:&quot;&quot;,&quot;paypal_mode&quot;:&quot;sandbox&quot;},&quot;wooCommerce&quot;:{&quot;enable&quot;:false,&quot;product_id&quot;:&quot;&quot;,&quot;redirect_to&quot;:&quot;cart&quot;,&quot;description&quot;:&quot;[ccb-total-0]&quot;},&quot;stripe&quot;:{&quot;enable&quot;:false,&quot;secretKey&quot;:&quot;&quot;,&quot;publishKey&quot;:&quot;&quot;,&quot;description&quot;:&quot;[ccb-total-0]&quot;},&quot;recaptcha&quot;:{&quot;enable&quot;:false,&quot;siteKey&quot;:&quot;&quot;,&quot;secretKey&quot;:&quot;&quot;},&quot;icon&quot;:&quot;fas fa-cogs&quot;,&quot;type&quot;:&quot;Cost Calculator Settings&quot;,&quot;calc_id&quot;:&quot;6991&quot;,&quot;title&quot;:&quot;Renovation&quot;},&quot;currency&quot;:{&quot;currency&quot;:&quot;$&quot;,&quot;num_after_integer&quot;:2,&quot;decimal_separator&quot;:&quot;.&quot;,&quot;thousands_separator&quot;:&quot;,&quot;,&quot;currency_position&quot;:&quot;left_with_space&quot;},&quot;fields&quot;:[{&quot;step&quot;:&quot;20&quot;,&quot;unit&quot;:&quot;75&quot;,&quot;sign&quot;:&quot;$&quot;,&quot;label&quot;:&quot;Square Feet ($75)&quot;,&quot;default&quot;:&quot;50&quot;,&quot;_id&quot;:&quot;0&quot;,&quot;minValue&quot;:&quot;0&quot;,&quot;maxValue&quot;:&quot;2000&quot;,&quot;description&quot;:&quot;&quot;,&quot;_event&quot;:&quot;change&quot;,&quot;additionalCss&quot;:&quot;&quot;,&quot;allowRound&quot;:false,&quot;_tag&quot;:&quot;cost-range&quot;,&quot;additionalStyles&quot;:&quot;&quot;,&quot;allowCurrency&quot;:&quot;1&quot;,&quot;type&quot;:&quot;Range Button&quot;,&quot;icon&quot;:&quot;fas fa-exchange-alt&quot;,&quot;alias&quot;:&quot;range_field_id_0&quot;},{&quot;step&quot;:&quot;1&quot;,&quot;unit&quot;:&quot;25&quot;,&quot;sign&quot;:&quot;$&quot;,&quot;label&quot;:&quot;Number of Rooms ($25/room)&quot;,&quot;default&quot;:&quot;3&quot;,&quot;_id&quot;:&quot;1&quot;,&quot;minValue&quot;:&quot;1&quot;,&quot;maxValue&quot;:&quot;10&quot;,&quot;description&quot;:&quot;&quot;,&quot;_event&quot;:&quot;change&quot;,&quot;additionalCss&quot;:&quot;&quot;,&quot;allowRound&quot;:false,&quot;_tag&quot;:&quot;cost-range&quot;,&quot;additionalStyles&quot;:&quot;&quot;,&quot;allowCurrency&quot;:&quot;1&quot;,&quot;type&quot;:&quot;Range Button&quot;,&quot;icon&quot;:&quot;fas fa-exchange-alt&quot;,&quot;alias&quot;:&quot;range_field_id_1&quot;},{&quot;label&quot;:&quot;&quot;,&quot;_id&quot;:&quot;4&quot;,&quot;_event&quot;:&quot;&quot;,&quot;type&quot;:&quot;Html&quot;,&quot;htmlContent&quot;:&quot;BATHROOM&quot;,&quot;placeholder&quot;:&quot;&quot;,&quot;_tag&quot;:&quot;cost-html&quot;,&quot;additionalCss&quot;:&quot;&quot;,&quot;additionalStyles&quot;:&quot;&quot;,&quot;icon&quot;:&quot;fas fa-code&quot;},{&quot;label&quot;:&quot;Bathroom Design&quot;,&quot;_id&quot;:&quot;5&quot;,&quot;default&quot;:&quot;250_0&quot;,&quot;description&quot;:&quot;&quot;,&quot;_event&quot;:&quot;change&quot;,&quot;type&quot;:&quot;Drop Down&quot;,&quot;allowRound&quot;:false,&quot;additionalCss&quot;:&quot;&quot;,&quot;additionalStyles&quot;:&quot;&quot;,&quot;allowCurrency&quot;:&quot;1&quot;,&quot;_tag&quot;:&quot;cost-drop-down&quot;,&quot;icon&quot;:&quot;fas fa-chevron-down&quot;,&quot;alias&quot;:&quot;dropDown_field_id_5&quot;,&quot;options&quot;:[{&quot;optionText&quot;:&quot;Low ($250)&quot;,&quot;optionValue&quot;:&quot;250&quot;},{&quot;optionValue&quot;:&quot;500&quot;,&quot;optionText&quot;:&quot;Middle ($500)&quot;},{&quot;optionValue&quot;:&quot;750&quot;,&quot;optionText&quot;:&quot;High ($750)&quot;}]},{&quot;step&quot;:&quot;10&quot;,&quot;unit&quot;:&quot;2&quot;,&quot;sign&quot;:&quot;$&quot;,&quot;label&quot;:&quot;Tiles ($2/tile)&quot;,&quot;default&quot;:&quot;4&quot;,&quot;_id&quot;:&quot;6&quot;,&quot;minValue&quot;:&quot;0&quot;,&quot;maxValue&quot;:&quot;100&quot;,&quot;description&quot;:&quot;&quot;,&quot;_event&quot;:&quot;change&quot;,&quot;additionalCss&quot;:&quot;&quot;,&quot;allowRound&quot;:false,&quot;_tag&quot;:&quot;cost-range&quot;,&quot;additionalStyles&quot;:&quot;&quot;,&quot;allowCurrency&quot;:&quot;1&quot;,&quot;type&quot;:&quot;Range Button&quot;,&quot;icon&quot;:&quot;fas fa-exchange-alt&quot;,&quot;alias&quot;:&quot;range_field_id_6&quot;},{&quot;_id&quot;:&quot;9&quot;,&quot;_event&quot;:&quot;&quot;,&quot;type&quot;:&quot;Html&quot;,&quot;htmlContent&quot;:&quot;OUTSIDE WORKS&quot;,&quot;placeholder&quot;:&quot;&quot;,&quot;_tag&quot;:&quot;cost-html&quot;,&quot;additionalStyles&quot;:&quot;&quot;,&quot;icon&quot;:&quot;fas fa-code&quot;},{&quot;_id&quot;:&quot;10&quot;,&quot;label&quot;:&quot;Choose options&quot;,&quot;description&quot;:&quot;&quot;,&quot;_event&quot;:&quot;change&quot;,&quot;type&quot;:&quot;Checkbox&quot;,&quot;allowRound&quot;:false,&quot;additionalCss&quot;:&quot;&quot;,&quot;additionalStyles&quot;:&quot;&quot;,&quot;allowCurrency&quot;:&quot;1&quot;,&quot;_tag&quot;:&quot;cost-checkbox&quot;,&quot;icon&quot;:&quot;fas fa-check-square&quot;,&quot;alias&quot;:&quot;checkbox_field_id_10&quot;,&quot;options&quot;:[{&quot;optionText&quot;:&quot;Swimming Pool&quot;,&quot;optionValue&quot;:&quot;250&quot;},{&quot;optionText&quot;:&quot;Exterior&quot;,&quot;optionValue&quot;:&quot;200&quot;}]},{&quot;_id&quot;:&quot;11&quot;,&quot;currency&quot;:&quot;$&quot;,&quot;type&quot;:&quot;Total&quot;,&quot;additionalCss&quot;:&quot;&quot;,&quot;_tag&quot;:&quot;cost-total&quot;,&quot;costCalcFormula&quot;:&quot;( range_field_id_0 + range_field_id_1 + range_field_id_2 ) + ( dropDown_field_id_5 + range_field_id_6 + range_field_id_7 ) + checkbox_field_id_10&quot;,&quot;additionalStyles&quot;:&quot;&quot;,&quot;alias&quot;:&quot;total_field_id_&quot;,&quot;icon&quot;:&quot;fas fa-calculator&quot;,&quot;label&quot;:&quot;Total&quot;,&quot;symbol&quot;:&quot;$&quot;,&quot;default&quot;:&quot;&quot;}],&quot;formula&quot;:[{&quot;id&quot;:&quot;11&quot;,&quot;alias&quot;:&quot;total_field_id_&quot;,&quot;label&quot;:&quot;Total&quot;,&quot;formula&quot;:&quot;( range_field_id_0 + range_field_id_1 + range_field_id_2 ) + ( dropDown_field_id_5 + range_field_id_6 + range_field_id_7 ) + checkbox_field_id_10&quot;}],&quot;conditions&quot;:[],&quot;styles&quot;:{&quot;v-container&quot;:{&quot;width&quot;:&quot;47.5%&quot;,&quot;margin&quot;:&quot;0px 0px 0px 0px &quot;,&quot;padding&quot;:&quot;50px 50px 50px 50px&quot;,&quot;box-shadow&quot;:&quot;0px 0px 0px 0px rgba(255,255,255,0) &quot;,&quot;border-width&quot;:&quot;0px 0px 0px 0px &quot;,&quot;border-style&quot;:&quot;solid &quot;,&quot;border-color&quot;:&quot;#ffffff &quot;,&quot;border-radius&quot;:&quot;10px 10px 10px 10px &quot;,&quot;background-color&quot;:&quot;#eff4f4&quot;,&quot;background-image&quot;:&quot;&quot;},&quot;h-container&quot;:{&quot;width&quot;:&quot;100% &quot;,&quot;margin&quot;:&quot;0px 0px 0px 0px &quot;,&quot;padding&quot;:&quot;50px 50px 50px 50px&quot;,&quot;box-shadow&quot;:&quot;0px 0px 0px 0px rgba(255,255,255,0) &quot;,&quot;border-width&quot;:&quot;0px 0px 0px 0px &quot;,&quot;border-style&quot;:&quot;solid &quot;,&quot;border-color&quot;:&quot;#ffffff &quot;,&quot;border-radius&quot;:&quot;10px 10px 10px 10px &quot;,&quot;background-color&quot;:&quot;#eff4f4&quot;,&quot;background-image&quot;:&quot;&quot;},&quot;total-summary&quot;:{&quot;color&quot;:&quot;#000000&quot;,&quot;font-style&quot;:&quot;normal &quot;,&quot;font-size&quot;:&quot;16px&quot;,&quot;text-align&quot;:&quot;left &quot;,&quot;font-weight&quot;:&quot;400 &quot;,&quot;text-shadow&quot;:&quot;0px 0px 0px rgba(255,255,255,0) &quot;,&quot;letter-spacing&quot;:&quot;0px&quot;},&quot;labels&quot;:{&quot;color&quot;:&quot;#000000&quot;,&quot;margin&quot;:&quot;0px 0px 8px 0px &quot;,&quot;padding&quot;:&quot;0px 0px 0px 0px &quot;,&quot;font-size&quot;:&quot;14px&quot;,&quot;text-align&quot;:&quot;left &quot;,&quot;font-style&quot;:&quot;normal &quot;,&quot;font-weight&quot;:&quot;bold &quot;,&quot;text-shadow&quot;:&quot;0px 0px 0px rgba(255,255,255,0) &quot;,&quot;letter-spacing&quot;:&quot;0px&quot;},&quot;descriptions&quot;:{&quot;color&quot;:&quot;#a29f9f&quot;,&quot;margin&quot;:&quot;3px 0px 3px 0px &quot;,&quot;padding&quot;:&quot;0px 0px 0px 0px &quot;,&quot;font-size&quot;:&quot;12px&quot;,&quot;text-align&quot;:&quot;left &quot;,&quot;font-style&quot;:&quot;normal &quot;,&quot;font-weight&quot;:&quot;400 &quot;,&quot;text-shadow&quot;:&quot;0px 0px 0px rgba(255,255,255,0) &quot;,&quot;letter-spacing&quot;:&quot;0px&quot;},&quot;drop-down&quot;:{&quot;color&quot;:&quot;#000000&quot;,&quot;margin&quot;:&quot;0px 0px 0px 0px &quot;,&quot;padding&quot;:&quot;17px 15px 17px 15px &quot;,&quot;font-size&quot;:&quot;14px&quot;,&quot;text-align&quot;:&quot;left &quot;,&quot;box-shadow&quot;:&quot;0px 0px 0px 0px rgba(255,255,255,0) &quot;,&quot;font-style&quot;:&quot;normal &quot;,&quot;font-weight&quot;:&quot;400 &quot;,&quot;text-shadow&quot;:&quot;0px 0px 0px rgba(255,255,255,0) &quot;,&quot;border-width&quot;:&quot;1px 1px 1px 1px &quot;,&quot;border-style&quot;:&quot;solid &quot;,&quot;letter-spacing&quot;:&quot;0px&quot;,&quot;background-color&quot;:&quot;#fff &quot;},&quot;radio-button&quot;:{&quot;color&quot;:&quot;#000000&quot;,&quot;font-size&quot;:&quot;14px&quot;,&quot;text-align&quot;:&quot;left &quot;,&quot;font-style&quot;:&quot;normal &quot;,&quot;font-weight&quot;:&quot;400 &quot;,&quot;text-shadow&quot;:&quot;0px 0px 0px rgba(255,255,255,0) &quot;,&quot;letter-spacing&quot;:&quot;0px&quot;,&quot;radioColor&quot;:&quot;#fff&quot;,&quot;radioBorder&quot;:&quot;#bdc9ca&quot;,&quot;radioChecked&quot;:&quot;#00b163&quot;},&quot;checkbox&quot;:{&quot;color&quot;:&quot;#000000&quot;,&quot;font-size&quot;:&quot;14px&quot;,&quot;text-align&quot;:&quot;left &quot;,&quot;font-style&quot;:&quot;normal &quot;,&quot;font-weight&quot;:&quot;400 &quot;,&quot;text-shadow&quot;:&quot;0px 0px 0px rgba(255,255,255,0) &quot;,&quot;letter-spacing&quot;:&quot;0px&quot;,&quot;b_color&quot;:&quot;#bdc9ca&quot;,&quot;bg_color&quot;:&quot;#00b163&quot;,&quot;checkedColor&quot;:&quot;#fff&quot;,&quot;checkbox_color&quot;:&quot;#fff&quot;},&quot;range-button&quot;:{&quot;fColor&quot;:&quot;#ccc&quot;,&quot;circleColor&quot;:&quot;#00b163 &quot;,&quot;lineColor&quot;:&quot;#00b163 &quot;},&quot;toggle&quot;:{&quot;color&quot;:&quot;#000000&quot;,&quot;font-size&quot;:&quot;14px&quot;,&quot;text-align&quot;:&quot;left &quot;,&quot;font-style&quot;:&quot;normal &quot;,&quot;font-weight&quot;:&quot;400 &quot;,&quot;text-shadow&quot;:&quot;0px 0px 0px rgba(255,255,255,0) &quot;,&quot;letter-spacing&quot;:&quot;0px&quot;,&quot;circleColor&quot;:&quot;#ffff&quot;,&quot;bg_color&quot;:&quot;#ccc &quot;,&quot;checkedColor&quot;:&quot;#00b163 &quot;},&quot;quantity&quot;:{&quot;color&quot;:&quot;#000000&quot;,&quot;width&quot;:&quot;100% &quot;,&quot;margin&quot;:&quot;0px 0px 0px 0px &quot;,&quot;padding&quot;:&quot;17px 15px 17px 15px &quot;,&quot;font-size&quot;:&quot;14px&quot;,&quot;text-align&quot;:&quot;left &quot;,&quot;font-style&quot;:&quot;normal &quot;,&quot;font-weight&quot;:&quot;400 &quot;,&quot;text-shadow&quot;:&quot;0px 0px 0px rgba(255,255,255,0) &quot;,&quot;border-width&quot;:&quot;1px 1px 1px 1px &quot;,&quot;border-style&quot;:&quot;solid &quot;,&quot;border-color&quot;:&quot;#d0d0d0 &quot;,&quot;border-radius&quot;:&quot;0px 0px 0px 0px &quot;,&quot;letter-spacing&quot;:&quot;0px&quot;,&quot;background-color&quot;:&quot;#fff &quot;},&quot;text-area&quot;:{&quot;color&quot;:&quot;#000000&quot;,&quot;width&quot;:&quot;100%&quot;,&quot;margin&quot;:&quot;0px 0px 0px 0px &quot;,&quot;padding&quot;:&quot;10px 10px 10px 10px &quot;,&quot;font-size&quot;:&quot;14px&quot;,&quot;text-align&quot;:&quot;left &quot;,&quot;font-style&quot;:&quot;normal &quot;,&quot;font-weight&quot;:&quot;400 &quot;,&quot;text-shadow&quot;:&quot;0px 0px 0px rgba(255,255,255,0) &quot;,&quot;border-style&quot;:&quot;solid &quot;,&quot;border-width&quot;:&quot;1px 1px 1px 1px &quot;,&quot;border-color&quot;:&quot;#d0d0d0&quot;,&quot;border-radius&quot;:&quot;0px 0px 0px 0px&quot;,&quot;letter-spacing&quot;:&quot;0px&quot;,&quot;background-color&quot;:&quot;#fff&quot;},&quot;hr-line&quot;:{&quot;margin&quot;:&quot;0px 0px 0px 0px &quot;,&quot;padding&quot;:&quot;0px 0px 0px 0px &quot;,&quot;border-bottom-color&quot;:&quot;#bdc9ca &quot;},&quot;total&quot;:{&quot;color&quot;:&quot;#000000&quot;,&quot;font-size&quot;:&quot;16px&quot;,&quot;font-style&quot;:&quot;normal &quot;,&quot;text-align&quot;:&quot;&quot;,&quot;font-weight&quot;:&quot;700 &quot;,&quot;text-shadow&quot;:&quot;0px 0px 0px rgba(255,255,255,0) &quot;,&quot;letter-spacing&quot;:&quot;0px&quot;},&quot;headers&quot;:{&quot;color&quot;:&quot;#000000&quot;,&quot;font-size&quot;:&quot;22px&quot;,&quot;font-style&quot;:&quot;normal &quot;,&quot;text-align&quot;:&quot; &quot;,&quot;font-weight&quot;:&quot;700 &quot;,&quot;text-shadow&quot;:&quot;0px 0px 0px rgba(255,255,255,0) &quot;,&quot;letter-spacing&quot;:&quot;0px&quot;},&quot;submit-button&quot;:{&quot;color&quot;:&quot;#fff&quot;,&quot;margin&quot;:&quot;0px 0px 0px 0px&quot;,&quot;padding&quot;:&quot;20px 40px 20px 40px&quot;,&quot;font-size&quot;:&quot;13px&quot;,&quot;font-style&quot;:&quot;normal &quot;,&quot;text-align&quot;:&quot;&quot;,&quot;font-weight&quot;:&quot;400&quot;,&quot;text-shadow&quot;:&quot;0px 0px 0px rgba(255,255,255,0) &quot;,&quot;letter-spacing&quot;:&quot;0px&quot;,&quot;border-width&quot;:&quot;1px 1px 1px 1px&quot;,&quot;border-style&quot;:&quot;solid&quot;,&quot;border-color&quot;:&quot;#00b163&quot;,&quot;background-color&quot;:&quot;#00b163&quot;}}}" inline-template :id="6991">
            <loader  v-if="loader"></loader>
            <template>
                        <h4 :style="$store.getters.getCustomStyles['headers']">Renovation</h4>
                    <!-- List of Fields -->
                                                                                                        <component
                                        inline-template
                                        style=""
                                        is="cost-range"
                                        field="{&quot;step&quot;:&quot;20&quot;,&quot;unit&quot;:&quot;75&quot;,&quot;sign&quot;:&quot;$&quot;,&quot;label&quot;:&quot;Square Feet ($75)&quot;,&quot;default&quot;:&quot;50&quot;,&quot;_id&quot;:&quot;0&quot;,&quot;minValue&quot;:&quot;0&quot;,&quot;maxValue&quot;:&quot;2000&quot;,&quot;description&quot;:&quot;&quot;,&quot;_event&quot;:&quot;change&quot;,&quot;additionalCss&quot;:&quot;&quot;,&quot;allowRound&quot;:false,&quot;_tag&quot;:&quot;cost-range&quot;,&quot;additionalStyles&quot;:&quot;&quot;,&quot;allowCurrency&quot;:&quot;1&quot;,&quot;type&quot;:&quot;Range Button&quot;,&quot;icon&quot;:&quot;fas fa-exchange-alt&quot;,&quot;alias&quot;:&quot;range_field_id_0&quot;}"
                                    v-model=fields[&#039;range_field_id_0&#039;].value                                    @change=change                                >
             {{ rangeField.label }}
             {{ rangeValue }} {{ rangeField.sign ? rangeField.sign : '' }}
        <input type="hidden" :data-options='options' value="0"/>
        <p style="margin-top: 15px"></p>
        <p :style="$store.getters.getCustomStyles['descriptions']">{{ rangeField.description }}</p>
                                </component>
                                                                                                                <component
                                        inline-template
                                        style=""
                                        is="cost-range"
                                        field="{&quot;step&quot;:&quot;1&quot;,&quot;unit&quot;:&quot;25&quot;,&quot;sign&quot;:&quot;$&quot;,&quot;label&quot;:&quot;Number of Rooms ($25/room)&quot;,&quot;default&quot;:&quot;3&quot;,&quot;_id&quot;:&quot;1&quot;,&quot;minValue&quot;:&quot;1&quot;,&quot;maxValue&quot;:&quot;10&quot;,&quot;description&quot;:&quot;&quot;,&quot;_event&quot;:&quot;change&quot;,&quot;additionalCss&quot;:&quot;&quot;,&quot;allowRound&quot;:false,&quot;_tag&quot;:&quot;cost-range&quot;,&quot;additionalStyles&quot;:&quot;&quot;,&quot;allowCurrency&quot;:&quot;1&quot;,&quot;type&quot;:&quot;Range Button&quot;,&quot;icon&quot;:&quot;fas fa-exchange-alt&quot;,&quot;alias&quot;:&quot;range_field_id_1&quot;}"
                                    v-model=fields[&#039;range_field_id_1&#039;].value                                    @change=change                                >
             {{ rangeField.label }}
             {{ rangeValue }} {{ rangeField.sign ? rangeField.sign : '' }}
        <input type="hidden" :data-options='options' value="0"/>
        <p style="margin-top: 15px"></p>
        <p :style="$store.getters.getCustomStyles['descriptions']">{{ rangeField.description }}</p>
                                </component>
                                                                                                                <component
                                        inline-template
                                        style=""
                                        is="cost-html"
                                        field="{&quot;label&quot;:&quot;&quot;,&quot;_id&quot;:&quot;4&quot;,&quot;_event&quot;:&quot;&quot;,&quot;type&quot;:&quot;Html&quot;,&quot;htmlContent&quot;:&quot;BATHROOM&quot;,&quot;placeholder&quot;:&quot;&quot;,&quot;_tag&quot;:&quot;cost-html&quot;,&quot;additionalCss&quot;:&quot;&quot;,&quot;additionalStyles&quot;:&quot;&quot;,&quot;icon&quot;:&quot;fas fa-code&quot;}"
                                                                        @=change                                >
                                                                    </component>
                                                                                                                <component
                                        inline-template
                                        style=""
                                        is="cost-drop-down"
                                        field="{&quot;label&quot;:&quot;Bathroom Design&quot;,&quot;_id&quot;:&quot;5&quot;,&quot;default&quot;:&quot;250_0&quot;,&quot;description&quot;:&quot;&quot;,&quot;_event&quot;:&quot;change&quot;,&quot;type&quot;:&quot;Drop Down&quot;,&quot;allowRound&quot;:false,&quot;additionalCss&quot;:&quot;&quot;,&quot;additionalStyles&quot;:&quot;&quot;,&quot;allowCurrency&quot;:&quot;1&quot;,&quot;_tag&quot;:&quot;cost-drop-down&quot;,&quot;icon&quot;:&quot;fas fa-chevron-down&quot;,&quot;alias&quot;:&quot;dropDown_field_id_5&quot;,&quot;options&quot;:[{&quot;optionText&quot;:&quot;Low ($250)&quot;,&quot;optionValue&quot;:&quot;250&quot;},{&quot;optionValue&quot;:&quot;500&quot;,&quot;optionText&quot;:&quot;Middle ($500)&quot;},{&quot;optionValue&quot;:&quot;750&quot;,&quot;optionText&quot;:&quot;High ($750)&quot;}]}"
                                    v-model=fields[&#039;dropDown_field_id_5&#039;].value                                    @change=change                                >
        {{ dropDownField.label }}
        <select placeholder="test" v-model="selectValue" :class="dropDownField.additionalStyles" :style="$store.getters.getCustomStyles['drop-down']" >
            <option value="0" selected>- Select value -</option>
            <option v-for="element in getOptions" :key="element.value" :value="element.value">{{element.label}}</option>
        </select>
    <p :style="$store.getters.getCustomStyles['descriptions']">{{ dropDownField.description }}</p>
                                </component>
                                                                                                                <component
                                        inline-template
                                        style=""
                                        is="cost-range"
                                        field="{&quot;step&quot;:&quot;10&quot;,&quot;unit&quot;:&quot;2&quot;,&quot;sign&quot;:&quot;$&quot;,&quot;label&quot;:&quot;Tiles ($2/tile)&quot;,&quot;default&quot;:&quot;4&quot;,&quot;_id&quot;:&quot;6&quot;,&quot;minValue&quot;:&quot;0&quot;,&quot;maxValue&quot;:&quot;100&quot;,&quot;description&quot;:&quot;&quot;,&quot;_event&quot;:&quot;change&quot;,&quot;additionalCss&quot;:&quot;&quot;,&quot;allowRound&quot;:false,&quot;_tag&quot;:&quot;cost-range&quot;,&quot;additionalStyles&quot;:&quot;&quot;,&quot;allowCurrency&quot;:&quot;1&quot;,&quot;type&quot;:&quot;Range Button&quot;,&quot;icon&quot;:&quot;fas fa-exchange-alt&quot;,&quot;alias&quot;:&quot;range_field_id_6&quot;}"
                                    v-model=fields[&#039;range_field_id_6&#039;].value                                    @change=change                                >
             {{ rangeField.label }}
             {{ rangeValue }} {{ rangeField.sign ? rangeField.sign : '' }}
        <input type="hidden" :data-options='options' value="0"/>
        <p style="margin-top: 15px"></p>
        <p :style="$store.getters.getCustomStyles['descriptions']">{{ rangeField.description }}</p>
                                </component>
                                                                                                                <component
                                        inline-template
                                        style=""
                                        is="cost-html"
                                        field="{&quot;_id&quot;:&quot;9&quot;,&quot;_event&quot;:&quot;&quot;,&quot;type&quot;:&quot;Html&quot;,&quot;htmlContent&quot;:&quot;OUTSIDE WORKS&quot;,&quot;placeholder&quot;:&quot;&quot;,&quot;_tag&quot;:&quot;cost-html&quot;,&quot;additionalStyles&quot;:&quot;&quot;,&quot;icon&quot;:&quot;fas fa-code&quot;}"
                                                                        @=change                                >
                                                                    </component>
                                                                                                                <component
                                        inline-template
                                        style=""
                                        is="cost-checkbox"
                                        field="{&quot;_id&quot;:&quot;10&quot;,&quot;label&quot;:&quot;Choose options&quot;,&quot;description&quot;:&quot;&quot;,&quot;_event&quot;:&quot;change&quot;,&quot;type&quot;:&quot;Checkbox&quot;,&quot;allowRound&quot;:false,&quot;additionalCss&quot;:&quot;&quot;,&quot;additionalStyles&quot;:&quot;&quot;,&quot;allowCurrency&quot;:&quot;1&quot;,&quot;_tag&quot;:&quot;cost-checkbox&quot;,&quot;icon&quot;:&quot;fas fa-check-square&quot;,&quot;alias&quot;:&quot;checkbox_field_id_10&quot;,&quot;options&quot;:[{&quot;optionText&quot;:&quot;Swimming Pool&quot;,&quot;optionValue&quot;:&quot;250&quot;},{&quot;optionText&quot;:&quot;Exterior&quot;,&quot;optionValue&quot;:&quot;200&quot;}]}"
                                    v-model=fields[&#039;checkbox_field_id_10&#039;].value                                    @change=change                                >
         {{ checkboxField.label }}
            <input type="checkbox" :id="checkboxLabel + index" :value="element.value" @change="change(event, element.label)" :class="checkboxField.additionalStyles">
            <label :for="checkboxLabel + index">
                {{ element.label }}
            </label>
        <p :style="$store.getters.getCustomStyles['descriptions']">{{ checkboxField.description }}</p>
                                </component>
                        <h4 :style="$store.getters.getCustomStyles['headers']">Total Summary</h4>
                        <template v-for="field in Object.values(calcStore)" v-if="field.alias.indexOf('total') === -1 && settings && settings.general.descriptions === 'show'">
                                 {{ field.label | to_short(50) }}
                                 {{ field.converted }}
                                     {{ option.label | to_short }}
                                     {{ option.converted }}
<!--                                    {{ option.label | dots(option.converted, '--><!--') }}-->
                        </template>
                             {{ item.label }}
                             {{ item.converted }}
            </template>
    </calc-builder-front>
			<h2 style="text-align: center;font-weight:700">Subscription Plans
</h2>
<p style="text-align: center;">Our company offers you different packages to choose from. It helps us to define the project scope, and you to act in accordance with your opportunities.</p>
                                                    Starter
                        Free
                                                    for up to 2 editors and 3 projects
<ul>
 	<li>3 projects</li>
 	<li>30-day version history</li>
 	<li>Up to 2 editors</li>
 	<li>Unlimited cloud storage</li>
</ul>
                        <a
                                href="#"
                                title="Get now"
                                                        >Get now</a>
                        Popular
                                                    Professional
                        $12
                                                                            /mo
                                                    for up to 2 editors and 3 projects
<ul>
 	<li>Unlimited projects</li>
 	<li>Unlimited version history</li>
 	<li>Custom file/user permissions</li>
 	<li>Invite-only private projects</li>
</ul>
                        <a
                                href="#"
                                title="Get now"
                                                        >Get now</a>
                                                    Organization
                        $24
                                                                            /mo
                                                    for up to 2 editors and 3 projects
<ul>
 	<li>Org-wide design systems</li>
 	<li>Centralized teams</li>
 	<li>Private plugins</li>
 	<li>Plugin administration</li>
</ul>
                        <a
                                href="#"
                                title="Get now"
                                                        >Get now</a>
		Companies seem to dislike the term ‘turnaround consulting’ because it represents failure. The truth is that turnaround consulting represents success at realizing the company is going in the wrong direction. The only time the company fails is when it is not possible to do a turnaround anymore. We help companies pivot into more profitable directions where they can expand and grow. It is inevitable that companies will end up making a few mistakes; we help them correct these mistakes.
We help companies turnaround their non-profitable ventures into something that benefits them. Our specialty lies in understanding what makes a company special and what makes it tick.
<blockquote>Consulting WP – we help companies assess their skills and choose a new direction which utilizes the talents of the team and resources most productively.</blockquote>
										<img width="1024" height="683" src="https://consulting.stylemixthemes.com/demo/testimonials/testimonials-1.jpg" alt="consulting_placeholder" srcset="http://tester.loc/wp-content/uploads/2020/07/placeholder-1024x683.gif 1024w, http://tester.loc/wp-content/uploads/2020/07/placeholder-300x200.gif 300w, http://tester.loc/wp-content/uploads/2020/07/placeholder-768x512.gif 768w, http://tester.loc/wp-content/uploads/2020/07/placeholder-1536x1024.gif 1536w, http://tester.loc/wp-content/uploads/2020/07/placeholder-600x400.gif 600w" sizes="(max-width: 1024px) 100vw, 1024px" />