<div class="movu-card-holder personal-info-card">
    <div class="movu-card-block">
        <div class="movu-card-block-inner">
            <div class="title-wrapper">

                <svg class="movu-card-title-icon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 23 24">
                    <defs>
                        <path id="logout-a" d="M12,2 C6.48,2 2,6.48 2,12 C2,17.52 6.48,22 12,22 C17.52,22 22,17.52 22,12 C22,6.48 17.52,2 12,2 Z M18.36,16.83 C16.93,15.09 13.46,14.5 12,14.5 C10.54,14.5 7.07,15.09 5.64,16.83 C4.62,15.49 4,13.82 4,12 C4,7.59 7.59,4 12,4 C16.41,4 20,7.59 20,12 C20,13.82 19.38,15.49 18.36,16.83 Z M12,6 C10.06,6 8.5,7.56 8.5,9.5 C8.5,11.44 10.06,13 12,13 C13.94,13 15.5,11.44 15.5,9.5 C15.5,7.56 13.94,6 12,6 Z" />
                    </defs>
                    <g fill="none" fill-rule="evenodd">
                        <polygon points="0 0 24 0 24 24 0 24" />
                        <mask id="logout-b" fill="#fff">
                            <use xlink:href="#logout-a" />
                        </mask>
                        <use fill="#5C5C5C" fill-rule="nonzero" xlink:href="#logout-a" />
                        <g fill="#5C5C5C" mask="url(#logout-b)">
                            <rect width="24" height="24" />
                        </g>
                    </g>
                </svg>

                <h3 class="movu-card-title">contact information</h3>

            </div>

            <div class="border-2-bottom"></div>

            <section class="clearfix">

                <div class="row">
                    <div class="col-xs-12">
                        <div style="display: inline-block;">
                            <div class="form-radio-btn">
                                <label class="radio-btn radio checked" for="radio_btn_input">
                                    <div class="radio-btn-title-holder">
                                        <div class="radio-btn-title-section">
                                            <span class="radio-btn-text">Mr</span>

                                        </div>

                                    </div>
                                    <input type="radio" hidden class="radio-btn-default" value="radio-btn-name">

                                </label>
                            </div>

                        </div>
                        <div style="display: inline-block; margin-left: 16px;">
                            <div class="form-radio-btn">
                                <label class="radio-btn radio" for="radio_btn_input">
                                    <div class="radio-btn-title-holder">
                                        <div class="radio-btn-title-section">
                                            <span class="radio-btn-text">Ms</span>

                                        </div>

                                    </div>
                                    <input type="radio" hidden class="radio-btn-default" value="radio-btn-name">

                                </label>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="col-xs-12 col-sm-6 no-padding-left no-padding-right-xs">
                    <movu-text-input placeholder="First name" message></movu-text-input>
                </div>
                <div class="col-xs-12 col-sm-6 no-padding-left no-padding-right">
                    <movu-text-input placeholder="Last name" message></movu-text-input>
                </div>
                <div class="col-xs-12 col-sm-6 no-padding-left no-padding-right-xs">
                    <movu-text-input placeholder="Email address" message></movu-text-input>
                </div>
                <div class="col-xs-12 col-sm-6 no-padding-left no-padding-right">
                    <movu-text-input placeholder="Mobile phone" message></movu-text-input>
                </div>
                <p class="small">We use your contact information to send you notifications about your quotes. Your mobile phone number allows us to contact you in case of any questions.</p>
                <a class="small movu-spacing-16-top" target="_blank" href="https://www.movu.ch/en/privacy/"> Privacy policy</a>

            </section>
        </div>
    </div>
</div>
{% extends '@card-with-heading' %}
{% block cardContent %}
    <div class="row">
        <div class="col-xs-12">
            <div style="display: inline-block;">
            {% render '@radio-button--checked', { radioBtnText: 'Mr' }, true %}
            </div>
            <div style="display: inline-block; margin-left: 16px;">
            {% render '@radio-button', { radioBtnText: 'Ms' }, true %}
            </div>
        </div>
    </div>
    <div class="col-xs-12 col-sm-6 no-padding-left no-padding-right-xs">
        <movu-text-input placeholder="First name" message></movu-text-input>
    </div>
    <div class="col-xs-12 col-sm-6 no-padding-left no-padding-right">
        <movu-text-input placeholder="Last name" message></movu-text-input>
    </div>
    <div class="col-xs-12 col-sm-6 no-padding-left no-padding-right-xs">
        <movu-text-input placeholder="Email address" message></movu-text-input>
    </div>
    <div class="col-xs-12 col-sm-6 no-padding-left no-padding-right">
        <movu-text-input placeholder="Mobile phone" message></movu-text-input>
    </div>
    <p class="small">We use your contact information to send you notifications about your quotes. Your mobile phone number allows us to contact you in case of any questions.</p>
    <a class="small movu-spacing-16-top" target="_blank" href="https://www.movu.ch/en/privacy/"> Privacy policy</a>
{% endblock %}
{
  "cardTitle": "contact information",
  "cardClass": "personal-info-card",
  "titleBorderExists": true,
  "headerIcon": "<svg class=\"movu-card-title-icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 23 24\"> <defs> <path id=\"logout-a\" d=\"M12,2 C6.48,2 2,6.48 2,12 C2,17.52 6.48,22 12,22 C17.52,22 22,17.52 22,12 C22,6.48 17.52,2 12,2 Z M18.36,16.83 C16.93,15.09 13.46,14.5 12,14.5 C10.54,14.5 7.07,15.09 5.64,16.83 C4.62,15.49 4,13.82 4,12 C4,7.59 7.59,4 12,4 C16.41,4 20,7.59 20,12 C20,13.82 19.38,15.49 18.36,16.83 Z M12,6 C10.06,6 8.5,7.56 8.5,9.5 C8.5,11.44 10.06,13 12,13 C13.94,13 15.5,11.44 15.5,9.5 C15.5,7.56 13.94,6 12,6 Z\"/> </defs> <g fill=\"none\" fill-rule=\"evenodd\"> <polygon points=\"0 0 24 0 24 24 0 24\"/> <mask id=\"logout-b\" fill=\"#fff\"> <use xlink:href=\"#logout-a\"/> </mask> <use fill=\"#5C5C5C\" fill-rule=\"nonzero\" xlink:href=\"#logout-a\"/> <g fill=\"#5C5C5C\" mask=\"url(#logout-b)\"> <rect width=\"24\" height=\"24\"/> </g> </g> </svg>"
}

No notes defined.