::selection{
                color: #fff;
                background: #e85494;
            }

            ::-webkit-input-placeholder { color:#ccc; }
            ::-moz-placeholder { color:#ccc; }
            :-ms-input-placeholder { color:#ccc; }
            input:-moz-placeholder { color:#ccc; }



            * {
                box-sizing: border-box;
            }   
            body{
                line-height: 1.6;
                background: transparent;
                font-family: 'Gibson W01',"Helvetica Neue",Arial,sans-serif;
               
            }
            form{
                position: relative;
                max-width: 35em;
                margin: 0 auto;
                display: flex;
                flex-wrap: wrap;
            }

            p{
                position: relative;
                margin: 0 0 .5em;
                line-height: 1.3;
                color: #f5a1bb;
                text-transform: uppercase;
                font-size: 1em;
                width: 100%;
                text-align: center;
                font-weight: bold;

            }
           
            .form-field.first_name, .form-field.last_name{
                display: inline-block;
                width: 100%;
            }
            @media(min-width: 35em){
                .form-field.first_name, .form-field.last_name{
                    display: inline-block;
                    width: 50%;
                }
            }
            

            field group{
                display: -webkit-box; 
                display: -webkit-flex;
                display: flex;
                -webkit-flex-wrap: wrap;
                flex-wrap: wrap;
                margin: 1em auto;
            }

            .form-field{
                position: relative;
                width: 100%;
                padding: 0 5px;
                margin-left: 0;
                text-transform: none;
                font-weight: normal;
            }
            .form-field:before{
                display: none;
            }

            

            input{
                appearance: none;
                border: medium none;
                border: 1px solid #ddd;
                color: #616366;
                padding: 1em 1.3em;
                border-radius: 3px;
                width: 100%;
                background: #fff;
                font-family: 'Gibson W01',"Helvetica Neue",Arial,sans-serif;
                -webkit-transition: all .3s ease-in-out;
                transition: all .3s ease-in-out;
                font-size: 100%;
                margin: 0;
                background: 0 0;
                border: none;
                border-bottom: 1px solid rgba(255,255,255,.2);
                color: #fff;
                border-radius: 0;
                padding: .9em .9em .9em 0;
                padding-left: 5.5rem;
            }

            input:hover, input:focus{
                outline: 0;
                border-color: rgba(255,255,255,.5);
            }

            label{
                position: absolute;
                top: .875rem;
                left: 5px;
                color:#ccc!important;
            }

            form.form p label{
                color:#ccc;
            }

            .submit{
                position: relative;
                cursor: pointer;
                border: none;
                padding: 0;
                background-color: transparent;
                color: #616366;
                letter-spacing: .05em;
                text-transform: uppercase;
                color: #f5a1bb;
                font-weight: 700;
                font-size: .9em;
                margin: 1em auto;
                -webkit-transition: .2s;
                transition: .2s;
            }
            
            @media(min-width: 35em){
                .submit{
                    margin: 2em auto 1em;
                }
            }

            input[type="submit"]{
                position: relative;
                 padding-left: 0;
                 color: #f5a1bb;
                 text-transform: uppercase;
                 font-weight: bold;
                 border: 0;
                 cursor: pointer;

            }
            .submit:before{
                display: none;
            }
            .submit:after{
                content: "";
                position: absolute;
                top: .9375rem;
                left: calc(54% + .5rem);
                display: inline-block;
                text-indent: -5000px;
                overflow: hidden;
                text-align: left;
                height: 10px;
                vertical-align: middle;
                width: 10px;
                background-image: url(https://www.breastcancerfoundation.org.nz/images/sprites.png);
                background-repeat: no-repeat;
                background-position: -50px -50px;
                width: 19px;
                height: 14px;
                margin: 0 0 0 .6em;

                
            }

            @media(min-width: 35em){
                .submit:after{
                    left: calc(54% + 1rem);
                }
            }
            
            
            .errors{
                display: none;
            }

            .error{
                
            }

            .error input{
                border-bottom: 1px solid #f5a1bb;
            }

            .error.form-field{
                position: relative;
                margin-bottom: 2rem;
            }

            .error.form-field::after{
                content: 'This field is required';
                position: absolute;
                bottom: -1.5rem;
                left: .375rem;
                width: 100%;
                text-align: left;
                font-size: .8rem;
            }

            .error.no-label{
                display: none;
                
            }
            input:-webkit-autofill{
            border-bottom: 1px solid rgba(255,255,255,.2);
            -webkit-text-fill-color: #ffffff;
            background: none;
            -webkit-box-shadow: 0 0 0px 1000px #42444a inset;
            }

            input:-webkit-autofill:hover, 
            input:-webkit-autofill:focus{
                border-bottom: 1px solid rgba(255,255,255,.);
            }